1
私はやっている単純な学習者プロジェクトのためにYouTubeビデオプレーヤーのページを再作成しようとしています。現時点では、ページをセクション/ divに分割し、背景の色を変更してから、ページ上の正しい場所に配置しようとしています。私はメインビデオセクションに要素を使用していて、サムネイル/アップネームセクションには<aside>を使用しています。これはうまくいきました。私はそれらを入手しました。しかし、コメントのためにiframeの下に2つの<section>要素を追加しました。ページ。私のセクションの要素を削除するときに、それがどこにあるのかというと、私は何をしているのでしょうか？私のモックアップにセクションを追加すると私の脇にシフトします
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<title>Embedded Video | Skip</title>
</head>
<body>
<!-- NAV BAR -->
<nav>
</nav>
<!-- WRAPPER -->
<div id="wrapper">
<!-- CONTENT -->
<div id="content">
<!-- MAIN CONTENT -->
<iframe src="https://www.youtube.com/embed/V74l_zS1x8E" frameborder="0" allowfullscreen></iframe>
<section>
</section>
<section>
</section>
<!-- SIDEBAR -->
<aside>
</aside>
</div>
</div>
</body>
</html>
CSS
body {
margin: 0;
}
#wrapper {
width: 1440px;
height: 1795px;
padding-top: 10px;
background-color: pink;
}
#content {
padding: 0 80px;
}
nav {
background-color: gray;
top: 0;
width: 100%;
height: 50px;
}
aside {
background-color: blue;
width: 415px;
height: 1730px;
float: right;
}
iframe {
background-color: green;
width: 855px;
height: 480px;
float: left;
display: inline;
}
section {
width: 855px;
height: 130px;
margin-top: 10px;
background-color: blue;
float: left;
}
に追加クールああ、ありがとうございました！私は浮かんだ要素がそれをしたことを知らなかった、私は右に脇に浮かぶと思った、残りの部分は大丈夫だっただろうが、明らかにそうではなかった。再度、感謝します ：） – SkipCloud