ホームページ > 記事 > ウェブフロントエンド > HTML5 5 日目のメモ
CSS プロパティ
段落プロパティ
letter-spacing:10px; 単語間の距離
word-spacing:1px; 単語間の距離 (主に英語の Web サイトで使用されます)
text-transform:capitalize(各単語は大文字です) 大文字 (すべて大文字) 小文字 (すべて小文字) (主に英語の Web サイトで使用されます)
white-space:normal/nowrap (改行なし)
Box モデル
すべてのタグは 1 つの Box とみなされます。
ブロックレベル要素を大きなボックス、インライン要素を小さなボックスとして考えてください
ボックスモデルはどのような部分で構成されていますか?
width+height (コンテンツの幅と高さ)+padding (内側のマージン/パディング)+border(ボーダー)+margin(外側のマージン)
border:(ボーダー)
border-top:
border-bottom:
border-left:
border-right:
border-bottom: (下枠線)
border-bottom-style:solid (実線) dashed (破線) dotted (破線) double (double) Solid line) ボーダーの線のスタイル
border-bottom-color:red/#fff; ボーダーの色
border-bottom-width:3px; ボーダーの太さ
border:3px Solid red;
border:none/ 0;
border-top:none/0;
border-collapse:collapse (重複したエッジを削除)
padding: (inner margin, inner padding, inner padding) コンテンツからコンテンツまでの距離境界線は相対的です
padding-top:
padding-left:
padding-right:
padding-bottom:
(パディングはボックスの幅と高さに影響します)
padding:10px(上、下, left and right)
padding:10px 20px;(up, down, left, right) )
padding: 10px 20px 30px; (右上、下) left = right 「時計回りの原則に従う」
padding: 10px 20px 30px 40px; (右上、左下)
padding: 0 0 5px 0; (このようにのみ記述できます)
margin: (マージン、パディング) ラベル間の距離
相対
のインライン要素は実装できません
ブロックレベル要素の上下のマージンは累積できず、最大値のみを取ることができます
インライン要素とブロックレベル要素の左右のマージンは累積値です
。マージンはボックスの幅と高さに影響しません。
margin: 10px (上、下、左、右)
margin: 10px 20px; 20px 30px; (右上、下) left = right 「時計回りの原則に従う」
margin: 10px 20px 30px 40px; (右上、左下)
margin: 0 0 5px 0; )
ボックスの実際のサイズ:
幅: コンテンツの幅 (幅) + ボーダー (左右) + パディング ((左右) + マージン (左右)
高さ: コンテンツの高さコンテンツ (高さ) + ボーダー (上部と下部) + パディング (上部と下部) + マージン (上部と下部)
外側のマージンの適用: 親要素のセンタリング メソッドで、ブラウザーのボックスを中央に配置します
margin :0 auto;
CSS3の新しい属性
box-sizing: border -box/content-box borderとpaddingの値を無視する
以上がHTML5の5日目のメモの内容です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) にご注意ください。