目次
1.標準ストリーム
標準フローとは、要素のレイアウトプロセスを指します。レイアウト要素は、デフォルトで左から右、トップダウンのフロー配置になります。そして最後に、フォームは上から下に行に分割され、要素は各行で左から右に順番に配置されます。
ブロック要素
- 行を占有し、他の要素と並べることはできません
- 幅と高さを設定できます
行内元素
- 他の要素と並置され、
- 幅と高さを参照することはできません。デフォルトの幅はテキストの幅です
HTML要素との違い
標準ストリームには特に多くの制限があります。標準ストリームではウェブページを作成できません。幅と高さは並べて表示できるため、変更できません。したがって、標準ストリームから逸脱する必要があります。
cssには、標準のドキュメントフローから要素を作成するための、フローティングと絶対位置、および固定位置の3つの方法があります。
第二に、ボックスモデル
CSSボックスモデルは、基本的に、マージン、境界線、パディング、実際のコンテンツなど、周囲のHTML要素をカプセル化するボックスです。
ボックスモデルを使用すると、他の要素と周囲の要素の境界との間のスペースに要素を配置できます。
説明する写真:
- マージン -境界の外側の領域をクリアします。マージンは透明です。
- 境界線- 内側の余白の周りとコンテンツの外側の境界線。
- パディング -コンテンツの周囲の領域をクリアします。パディングは透明です。
- コンテンツ- ボックスのコンテンツ、テキストと画像の表示
三、フロート(フロート)
Float of CSSは要素を左または右に移動し、周囲の要素も再配置されます
img{
float:right; //左浮动
float:left; //右浮动
clear:boty; //清除浮动
}
第四に、ポジショニング(ポジション)
position属性は、要素の配置タイプを指定します。
positionプロパティの5つの値:
- static:デフォルト値。つまり、ポジショニングはなく、通常の標準ストリームオブジェクトに従います。
- 相対:要素に対する相対位置
- 修正済み:要素の位置は、ブラウザウィンドウに対して固定されています。
- 絶対:絶対位置の要素の位置は、最も近い位置の親要素を基準にしています。要素に位置の親要素がない場合、その位置は<html>を基準にしています。
- スティッキー:ユーザーのスクロール位置に基づく位置付け。スティッキーポジショニング要素は、ユーザーのスクロールに依存し、 位置:相対位置 と 位置:固定 位置を切り替えます。
これまでのところ、div + cssのコアコンテンツは終了しています。このブログがお役に立てば、メッセージを残してください+いいね!