初めて質問させていただきます。
会社に入社してすぐの新入社員なのですが、
Webの知識はほぼほぼなく、ページの作成を上司に頼まれ、
行き詰ってしまいましたので質問させてください。
htmlとcssでスマートフォン向けのページを1ページ。
背景画像、ロゴ、Youtubeの動画埋め込み
と、簡単な内容に感じたのですが、Youtubeの埋め込みで、
iPhone6で動作をチェックしたものの、上司のiPhone5のブラウザでは崩れが生じたとのこと
横幅のサイズの問題かとは思うのですが...
index.html
<html> <head> <title>TEST</title> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, minimal-ui"> <link rel="stylesheet" href="css/style.css" type="text/css"> </head> <body> <img src="images/header.png" class="header_pic"> <div class="movie_contents"> <div class="youtube"> <iframe width="640" height="360" src="https://www.youtube.com/embed/(Youtubeの動画ID)?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe> </div> <div class="footer"></div> </body> </html>style.css
@charset "utf-8";
/ここで背景が固定できないことはわかっているが
固定せずにこのまま背景画像を配置/
body {
background-image: url(../images/bg.jpg);
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #000000;
}
.header_pic{
display: block;
margin: 0 auto;
}
.movie_contents{
width: 80%;
height: 50%;
display: block;
margin: 10px auto 0 auto;}
.youtube{
}
.youtube iframe{
width:100%;
height:200px;
display:block;
margin:0 auto;
}
.footer{
height: 50px;
}
フッターには特に要素はなく、
後で画像を追加するそうです。
すみませんがご教授いただけると幸いです。
よろしくお願い致します。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。