定義和用法,瀏覽器支持,可能的值,TIY 實例,
定義和用法
border-width 簡寫屬性為元素的所有框線設定寬度，或者單獨地為各邊框線設定寬度。
只有當框線樣式不是 none 時才起作用。如果框線樣式是 none，框線寬度實際上會重置為 0。不允許指定負長度值。
border-width:thin medium thick 10px;
- 上框線是細框線
- 右框線是中等框線
- 下框線是粗框線
- 左框線是 10px 寬的框線
border-width:thin medium thick;
- 上框線是 10px
- 右框線和左框線是中等框線
- 下框線是粗框線
border-width:thin medium;
- 上框線和下框線是細框線
- 右框線和左框線是中等框線
border-width:thin;
- 所有 4 個框線都是細框線
| 默認值： | medium |
|---|---|
| 繼承性： | no |
| 版本： | CSS1 |
| JavaScript 語法： | object.style.borderWidth="thin thick" |
設定四個框線的寬度：
p { border-style:solid;border-width:15px;}
瀏覽器支持
所有瀏覽器都支持 border-width 屬性。
注釋：任何的版本的 Internet Explorer （包括 IE8）都不支持屬性值 "inherit"。
可能的值
| 值 | 描述 |
|---|---|
thin | 定義細的框線。 |
medium | 默認。定義中等的框線。 |
thick | 定義粗的框線。 |
length | 允許您自定義框線的寬度。 |
inherit | 規定應該從父元素繼承框線寬度。 |
TIY 實例
所有框線寬度屬性在一個聲明之中
本例演示用簡寫屬性來將所有框線寬度屬性設定於同一聲明中。
<html>
<head>
<style type="text/css">
p.one
{
border-style: solid;
border-width: 5px
}
p.two
{
border-style: solid;
border-width: thick
}
p.three
{
border-style: solid;
border-width: 5px 10px
}
p.four
{
border-style: solid;
border-width: 5px 10px 1px
}
p.five
{
border-style: solid;
border-width: 5px 10px 1px medium
}
</style>
</head>
<body>
<p class="one">Some text</p>
<p class="two">Some text</p>
<p class="three">Some text</p>
<p class="four">Some text</p>
<p class="five">Some text</p>
<p><b>注釋：</b>"border-width" 屬性如果單獨使用的話是不會起作用的。請首先使用 "border-style" 屬性來設定框線。</p>
</body>
</html>
