CSS border-bottom-style 屬性 · W3School CSS 參考手冊

# CSS border-bottom-style 屬性 ## 實例設置下邊框的樣式： ``` p { border-style:solid; border-bottom-style:dotted; } ``` ## 瀏覽器支持 | IE | Firefox | Chrome | Safari | Opera | | --- | --- | --- | --- | --- | 所有瀏覽器都支持 border-bottom-style 屬性。注釋：任何的版本的 Internet Explorer （包括 IE8）都不支持屬性值 "inherit" 或 "hidden"。 ## 定義和用法 border-bottom-style 設置元素下邊框的樣式。只有當這個值不是 none 時邊框才可能出現。在 CSS1 中，HTML 用戶代理只需支持 solid 和 none。 | 默認值： | _not specified_ | | --- | --- | | 繼承性： | no | | --- | --- | | 版本： | CSS1 | | --- | --- | | JavaScript 語法： | _object_.style.borderBottomStyle="dotted" | | --- | --- | ## 可能的值 | 值 | 描述 | | --- | --- | | none | 定義無邊框。 | | hidden | 與 "none" 相同。不過應用于表時除外，對于表，hidden 用于解決邊框沖突。 | | dotted | 定義點狀邊框。在大多數瀏覽器中呈現為實線。 | | dashed | 定義虛線。在大多數瀏覽器中呈現為實線。 | | solid | 定義實線。 | | double | 定義雙線。雙線的寬度等于 border-width 的值。 | | groove | 定義 3D 凹槽邊框。其效果取決于 border-color 的值。 | | ridge | 定義 3D 壟狀邊框。其效果取決于 border-color 的值。 | | inset | 定義 3D inset 邊框。其效果取決于 border-color 的值。 | | outset | 定義 3D outset 邊框。其效果取決于 border-color 的值。 | | inherit | 規定應該從父元素繼承邊框樣式。 | ## TIY 實例 [設置下邊框的樣式](/tiy/t.asp?f=csse_border-bottom-style) 本例演示如何設置下邊框的樣式。 ``` <html> <head> <style type="text/css"> p {border-style:solid} p.none {border-bottom-style:none} p.dotted {border-bottom-style:dotted} p.dashed {border-bottom-style:dashed} p.solid {border-bottom-style:solid} p.double {border-bottom-style:double} p.groove {border-bottom-style:groove} p.ridge {border-bottom-style:ridge} p.inset {border-bottom-style:inset} p.outset {border-bottom-style:outset} </style> </head> <body> No bottom border. A dotted bottom border. A dashed bottom border. A solid bottom border. A double bottom border. A groove bottom border. A ridge bottom border. An inset bottom border. An outset bottom border. </body> </html> ``` ## 相關頁面 CSS 教程：[CSS 邊框](/css/css_border.asp "CSS 邊框") CSS 參考手冊：[border-bottom 屬性](/cssref/pr_border-bottom.asp "CSS border-bottom 屬性") HTML DOM 參考手冊：[borderBottomStyle 屬性](/jsref/prop_style_borderbottomstyle.asp "HTML DOM borderBottomStyle 屬性")