第119課ウェブレイアウト方式

Webページのレイアウトは、ブラウザがWebページの要素をどのようにレイアウトするかということです.
1、標準フロー(ドキュメントフロー／通常フロー)のレイアウト方式
1、1実はブラウザのデフォルトのレイアウト方式は標準のレイアウト方式1.2 CSSの中で要素を3種類に分けて、それぞれブロック級要素/行内要素/行内ブロック級要素1.3標準ストリームの中で2種類のレイアウト方式があって、1つは垂直レイアウトで、1つは水平レイアウト垂直レイアウトで、要素がブロック級要素であれば、垂直レイアウトで、要素が行内要素/行内ブロック級要素であれば、では水平にレイアウトします
2、フローティングレイアウト方式
3、定位フローレイアウト方式

第120課フローティングフローの基本概念

フローティングレイアウト方式
1、フローティングフローは「半離脱標準フロー」のレイアウト方式である2、フローティングフローは水平レイアウトのみで、ある要素の左揃えまたは右揃えのみを設定することができる.
注意点1、フローティングフローはセンター中央揃えがない2、フローティングフローではmargin:0 autoは使用できません.の
特徴:
1、フローティングストリームの中でブロックレベルの要素/行内の要素/行内のブロックレベルの要素を区別しないで、すべて水平にレイアウトすることができます2、フローティングストリームの中でブロックレベルの要素/行内の要素/行内のブロックレベルの要素を区別しないで、すべて幅の高さを設定することができます3、総じて上述します:フローティングストリームの中の要素と標準ストリームの中の行内のブロックレベルの要素はとても似ています

第121課フローティング要素の脱標

要素の脱標:要素が標準ストリームから離れていることです
ある要素がフローティングされると、この要素は標準ストリームから削除されたように見えます.これがフローティング要素の脱標です.
影響:前の要素が浮動し、後ろの要素が浮動していない場合、前の要素が後ろの要素を覆う

第122課フローティング要素並べ替え規則

1、同じ方向の浮動要素、先に浮動する要素は前に表示して、後に浮動する要素は後の2、異なる方向の浮動要素に表示して、左浮動は左浮動を探して、右浮動は右浮動を探して3、浮動要素が浮動した後の位置、浮動要素が浮動する前に標準の流れの中の位置から確定します

第123課フローティング要素貼り付け現象

親要素の幅が要素の幅より小さい場合、要素は前の要素の前の要素を探して、幅が適切かどうかを確認します.もし適切であれば、前の要素に貼る前の要素が足りない場合は、親要素が見つかるまで探し続けます.

第124課フローティング要素の文字囲い現象

テキストはフローティング要素の周囲に表示されます

第125、126、127課フローティング練習

垂直方向すいちょくほうこう:標準フローすいへいほうこう:フローティングフローふぉーむ
1、copyはmargin padding 2を除去し、上から下へ、外から内へ3、先に垂直標準流、水平フローティングフローは企業開発中、垂直方向に標準流、水平方向にフローティングフローを使用する
複雑なインタフェース
1、上から下へレイアウト2、外から内へレイアウト3、水平方向はまず左から右に分けて、左/右をさらにレイアウトする
コンテンツ参照