概要
border-bottom-style はボックス境界の下の線の形状を設定します。
| 初期値 | none |
|---|---|
| 適用対象 | 全要素. It also applies to ::first-letter. |
| 継承 | 不可 |
| メディア | visual |
| 計算値 | 指定値 |
| アニメーションの可否 | 不可 |
| 正規順序 | 形式文法で定義される一意のあいまいでない順序 |
構文
<br-style>where
<br-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
<border-style> 値
- none
- 境界線無し。
- hidden
- 'none'と同じですが、テーブル要素において境界衝突の解決の方法が異なります。
- dotted
- 破線の一つ。
- dashed
- 短いダッシュや線分の一つ。
- solid
- 1本の直線、実線。
- double
border-widthが同じピクセルでもう1つ追加されたような、2本の直線。- groove
- 彫り込んだ効果。
- ridge
- 'groove' の逆。境界線が3D（浮き出る）表示になります。
- inset
- ボックスが埋め込まれて見える作り。
- outset
- 'inset' の逆。ボックスが3D（エンボス）に見える作り。
関連するプロパティ
サンプル
element {
border-bottom-size: 1px;
border-bottom-style: dotted;
border-bottom-color: #000;
}
注釈
border-styleの値が設定されていない場合、デフォルト値が 'none' に設定されているため境界線が表示されません。
仕様
ブラウザの互換性
| 機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| 基本機能 | 1.0 | 1.0 | 5.5 | 9.2 | 1.0 |
| 機能 | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| 基本機能 | ? | ? | ? | ? | ? |