フッタータグが行動

を割り当て挑発基本的なレイアウトはフッタータグが行動

フッタが身体のCSSやその子の影響を受けることが体の下にドロップしてはならない

<body> 
    <div class="wrapper"> 
     <nav></nav> 
     <myContent></myContent> 
    </div> 
</body> 
<footer></footer>

です。

本文に含まれるコンテンツの量や量に関係なく、フッターがページの最下部にくるようにします。このCSSはこのトリックを行う必要があります：

body, html { 
     height: 100vh; 
     } 
    .wrapper { 
     min-height: 96vh; 
     position: relative; 
     } 
    footer { 
     width: 100%; 
     height: 4vh; 
     position: relative; 
     bottom: 0; 
     font-size: .75em; 
     }

私のブラウザでは、フッターはbodyタグに含まれています。これは意味がありません。さらに、フッターの幅はビューポートと同じになりますが、デモモデルには反映されません。代わりに、その左側の境界線はページの左側にあり、右側に約10％のvwの空白があります。 backround-color: yellowを設定するとこれが確認されます。そして最後に、<myContent>が画面のビューの下にそれをプッシュしない限り、位置は底に行かない。

この設定で何が問題になっていますか？

出典

2016-08-19 Naltroc

HTML5では、実際に宣言しているかどうかにかかわらず、<head>または<body>要素に具体的にないものはほとんどすべてが割り当てられます。必要な要素が存在しない場合は作成されます。

として、the HTML5 spec,<html>,<head>および<body>は任意である。ほとんどのブラウザは、必要に応じて不足している要素を作成することによって動作します。（私の経験では、大部分がテーブルであり、<thead>と<tbody>です）

ブラウザのインスペクタを使用して表示されるコードは、通常、サーバから取得したものを「修正」した後にブラウザが使用しているコードです。

出典

2016-08-19 17:52:13 Ouroborus

HTMLでは、bodyタグはページの可視要素を囲みます。 HTMLにはHEAD要素がありますが、その要素は可視コンテンツ用ではなく、スタイルシートへのリンクなどの目に見えない要素用です.FOOTER要素はBODY要素に正しく属しています。

出典

2016-08-19 17:47:55

フッタヘッダおよび他の特定のセマンティックタグが=>http://www.w3schools.com/html/html5_semantic_elements.asp

出典

2016-08-19 17:48:46 Alegrowin

問題であり、身体の外の要素を持つことではないことが、有効なHTMLボディに囲まれなければなりません。現代のブラウザはこれを訂正し、この要素を内部に移動します。

出典

2016-08-19 17:50:39 CoverFire

フッター/ボディの配置について上記の注意をおねがいします。最後に、フッタを身体の内側または外側に置くことができると読んだが、あなたのコメントは注目されています。

インデックスページのインスペクタズームが変更されたため、他のページではフッタが正しく動作しませんでした。私はそれがどう起こったかは分かりませんが、リセットすることは、必要な場所にそれを置きます。

出典

2016-08-19 18:04:01 Naltroc

答えて

関連する問題