CSS ボックス モデルの境界線の設定: 境界線: 1px 赤の実線 (ピクセル スタイル カラー)、border-bottom: 1px 点線 #ccc_html/css_WEB-ITnose

ボックスモデル - 境界線 (1)

ボックスモデルの境界線は、コンテンツとフィラーを囲む線です。この線の太さ、スタイル、色 (境界線の 3 つの属性) を設定できます。

たとえば、次のコードは、境界線の太さを 2px、スタイルを実線、色を赤に設定する div のコードです:

div{    border:2px  solid  red;}

上記は境界線コードの省略形であり、個別に記述することができます。

div{    border-width:2px;    border-style:solid;    border-color:red;}

注:

1 、ボーダー スタイル (ボーダー スタイル) の一般的なスタイルは次のとおりです:

点線 (点線) | 実線 (実線)。

2. border-color (境界線の色) の色は、次のような 16 進数の色に設定できます:

border-color:#888;//前面的井号不要忘掉。

3. border-width (境界線の幅) の幅も次のように設定できます:

thin | 中 | 太さ (ただし、あまり一般的ではありません)、ピクセル (px) が最も一般的に使用されます。

Box Model--Border (2)

ここで、p タグの下の境界線を個別に設定したいが、他の 3 つの辺には境界線のスタイルを設定しない場合はどうすればよいでしょうか。 CSS スタイルを使用すると、一方向のみの境界線のスタイルを設定できます:

div{<strong>border-bottom</strong>:1px solid red;}

次のコードを使用して、他の 3 つの側面に上、右、左の境界線を設定することもできます:

border-top:1px solid red;border-right:1px solid red; border-left:1px solid red;