プロパティについて
#
#
値
値 | 説明 |
---|---|
“<line-style>”値 | |
none | 境界線を表示せず、境界線の太さや色の指定は無視されます (“border-collapse: collapse;”の場合に重なる境界線があればその境界線が表示されます。) |
hidden | 境界線を表示せず、境界線の太さや色の指定は無視されます (“border-collapse: collapse;”の場合に重なる境界線も表示されません。) |
dotted | 点線 |
dashed | 破線 |
solid | 実線 |
double | 二重線 |
groove | 溝のように見える線 |
ridge | 出っ張りのように見える線 |
inset | 境界線の中身が沈み込んでいるように見える線 (“border-collapse: collapse;”の場合は“ridge”とみなされます。) |
outset | 境界線の中身が出っ張っているように見える線 (“border-collapse: collapse;”の場合は“groove”とみなされます。) |
他の値 | |
共通キーワード |
#
使用例
#
左辺の境界線の見た目を指定する
div { border-left-style: hidden;}
div {
border-width: 5px;
border-left-style: dotted;
}
border-left-style: dotted;
div {
border-width: 5px;
border-left-style: dashed;
}
border-left-style: dashed;
div {
border-width: 5px;
border-left-style: solid;
}
border-left-style: solid;
div {
border-width: 5px;
border-left-style: double;
}
border-left-style: double;
div {
border-width: 5px;
border-left-style: groove;
}
border-left-style: groove;
div {
border-width: 5px;
border-left-style: ridge;
}
border-left-style: ridge;
div {
border-width: 5px;
border-left-style: inset;
}
border-left-style: inset;
div {
border-width: 5px;
border-left-style: outset;
}
border-left-style: outset;