独自の Div CSS 閲覧メモ (1)_html/css_WEB-ITnose

継承

border、margin、padding、backgroundは継承できません。

table tdはbodyの属性を継承しないため、別途指定する必要があります。

Weight

p {color:black;} /*重みは 1*/

p em {color: yellow;} /*重みは 2*/

p .note em .dark {color :gray;} /*重みは 22*/

#main{color: black;} /*重みは 100*/

p{color:red ! important;} /*重みは: 1000*/

インライン スタイル シート (タグに記述) > 埋め込みスタイル シート (ドキュメントの先頭に記述) > 外部スタイル シート (外部ファイルに記述)

要素分類

ブロックレベル要素 (表示: block): タイトル h、段落 p、表、レイヤー div、本文

インライン要素: (表示:inline): a、em、span

リスト項目: ( display:list-item):li

隠し要素: (display:none)

ボックスモデル

各 HTM 要素は、ボックス内のコンテンツとボックスの境界線の間の、物を含むボックスとみなすことができます。ボックス自体には境界線があり、ボックスの境界線と他のボックスの間にも「マージン」があります

要素の実際の幅は = 左境界線 + 左境界線 + 左パディング + コンテンツの幅です。 + 右パディング + 右ボーダー + 右ボーダー

注:

1、マージン値は負の値になる可能性があり、ブラウザごとにサポートされる内容が異なります。

2. デフォルトの境界線のスタイルは表示されません (border-style:none)。

3、パディング値を負にすることはできません。

4. ブロックレベルの要素の場合、フローティングされていない垂直方向に隣接する要素の上下の境界は圧縮されます。たとえば、上下に 2 つの要素がある場合、上の要素の下の境界は 10px で、上のインターフェイスは圧縮されます。下の要素の距離が 5 ピクセルの場合、2 つの要素間の実際の距離は 10 ピクセル (2 つの境界値の最大値) になります。図 1

5 に示すように、浮動要素の境界 (左または右の浮動に関係なく) は圧縮されません。図 2

6 に示すように、a などのインライン要素は上下の境界を定義し、行の高さには影響しません。

7. ボックスにコンテンツがない場合、幅と高さが定義されていても、実際には 0% しか占めません。

写真: 1

写真: 2