borderプロパティ
borderの一括指定は、color、width、styleの3つを順不同でブランク区切りで指定します
borderでは4辺を同時に指定することになります
border: 10px solid #000;
各値を個別に指定する場合は以下の通りです
border-widht: 10px;
border-style: solid;
border-color: #000;
のように別々に指定も可能です
その場合は4辺を異なる値で指定できます
指定は値をブランク区切りで指定します
値が1つの場合は、4辺同じ値になる
値が2つの場合は、上下、左右
値が3つの場合 上、左右 下
値が4ツの場合 上、右、下、左(時計回り)
4辺を個別に指定
borderプロパティの各辺を個別に指定する場合は以下プロパティを使用します
border-top 上
border-bottom 下
border-left 左
border-right 右
各々のプロパティにはさらにborderプロパティと同じようにcolor、width、styleの3つを順不同でブランク区切りで指定します
border-top:10px solid #000;
border-bottom: 10px solid #000;
border-left:10px solid #000;
border-right: 10px solid #000;
さらに各々のプロパティ値3つを別々に指定することもできます
border-top-width
border-top-style
border-top-color
これは。bottom、left、rightに対しても同じです
borderプロパティの指定をしていない値については、初期値が採用されます
width の初期値 medium
style の初期値 none
color の初期値 colorプロパティに現在設定されている色またはcolorプロパティの初期値
styleの種類(10px グレーで作成しました)
dashed
dotted
double
groove
inset
outset
ridge
solid
コメント