HTML5 6 日目のメモ

CSS レイアウト

通常のドキュメント フロー: 要素が上から下に配置される順序

ドキュメント フロー外: 要素が通常の配置順序から取り出されます

フローティング: ブロック レベルの要素を左端と右端に移動します親要素 (独自の意味に従って配置)

float (float): left/right/none;

clear (clear): left/right/both;

float は親要素に対して相対的に浮動小数点になります。図で使用される混合テキストレイアウト

フローティング要素がある場合、その親要素は高さが折りたたまれます。

不透明度は透明度を表します

PC Webページのレイアウト

固定幅で中央揃えのレイアウト

バナーヘッダー、ナビゲーション、フッターのレイアウト

基本コンポーネント: ヘッダー、ナビゲーション、バナー、本文、フッター

グローバルスタイル: (必須ページを作成するたびに書き込まれます)

*{
margin:0;
padding:0;
box-sizing:boder-box;content-box;
}
body{
font-size:12px;
font-family:Microsoft YaHei,"微软雅黑";
width:1000px;
margin:0 auto;
}
ul,ol,li{
list-style:none;
}
a{
text-decoration:none;
}
img{
border:none;
}

子要素に margin-top を追加すると、ブラウザーの非互換性が発生します。これは、親要素に padding: 0.1px を与えることで解決できます。

Rounded Corner 属性: border-radius: 20px。 30px 40px 50px;

円を作成するときは、border-radius:50%;を指定するだけです。

display:block; インライン要素をブロックレベルの要素に変換します

インライン要素のデフォルトの表示は、display:inline です。

; H5 new タグの場合は、時刻