border-style

設定物件左、右、上、下框線的樣式。

語法

{ border-style: sStyle }

可能的值

sStyle

指定或接收下列其中一個值的字串:

none

預設值。不繪製框線,無論指定的 border-width 為何皆同。

dashed

框線是由破折號組成的虛線。

dotted

框線是由點組成的虛線。

double

框線是繪製在物件背景上方的雙線。兩條線寬度與兩條線間距的總和等於 border-width 值。框線寬度至少必須是 3 像素,才能繪製雙框線。

groove

根據值的色彩繪製 3D 立體內凹。您必須指定物件的 border-width 屬性,才能正確呈現樣式。

inset

根據值的色彩繪製 3D 內凹。

outset

根據值的色彩繪製 3D 外凸。

ridge

根據值的色彩繪製 3D 立體浮凸。

solid

框線是實線。

window-inset

框線與內凹相同,但是周圍另有一條以根據值的色彩繪製而成的線。

此屬性的預設值為 none 。這不是繼承屬性。

範例

下列範例使用 border-style 屬性來指定框線樣式。此範例使用內嵌 (全域) 樣式表的呼叫,在 onmouseover 事件發生時,將框線的樣式變更為 groove

<head><style>
    td { border-style: solid; border-width: 0.5cm; }
    .change { border-style: groove; }
</style>
</head>
<body>
<table border >
<tr>
    <td onmouseover="this.className='change '" onmouseout="this.className=''">
        <img src="sphere.jpg">
    </td>
</tr>
</table>

標準資訊

此屬性是在階層式樣式表 (CSS) 層級 1 (CSS1) Ee371285.xtlink_newWindow(zh-tw,Expression.40).png (英文) 中定義。

適用於

A、ABBR、ACRONYM、B、BDO、BIG、BLOCKQUOTE、BODY、BUTTON、CAPTION、CENTER、CITE、CODE、CUSTOM、DD、DEFAULTS、DEL、DFN、DIV、DL、DT、EM、EMBED、FIELDSET、FONT、FORM、FRAME、HN、HR、I、IFRAME、IMG、INPUT TYPE=BUTTON、INPUT TYPE=CHECKBOX、INPUT TYPE=FILE、INPUT TYPE=IMAGE、INPUT TYPE=PASSWORD、INPUT TYPE=RADIO、INPUT TYPE=RESET、INPUT TYPE=SUBMIT、INPUT TYPE=TEXT、INS、LI、OBJECT、OL、P、Q、S、SPAN、SUB、TABLE、TD、TH、TT、U、UL、VAR、XMP

另請參閱

概念

border
border-top-style
border-right-style
border-bottom-style
border-left-style
border-width