CSS outline 屬性
示例
在 <h2> 元素和 <div> 元素周圍設定輪廓
h2 {
outline: 5px dotted green;
}
div.a {
outline: 2px dashed blue;
}
自己動手試一試 »
定義和用法
輪廓是繪製在元素邊框外部的一條線，用於使元素“脫穎而出”。
outline 屬性是以下屬性的簡寫：
如果省略 outline-color，則應用的顏色將是文字的顏色。
注意： 輪廓與 邊框 不同！與邊框不同，輪廓繪製在元素邊框的外部，並且可能會覆蓋其他內容。此外，輪廓不是元素尺寸的一部分；元素的總寬度和高度不受輪廓寬度的影響。
| 預設值 | 中等反色顏色 |
|---|---|
| 繼承 | no |
| 可動畫 | 是的，請參閱單獨的屬性。 瞭解可動畫屬性 嘗試一下 |
| 版本 | CSS2 |
| JavaScript 語法 | object.style.outline="#0000FF dotted 5px" 嘗試一下 |
瀏覽器支援
表中的數字指定了完全支援該屬性的第一個瀏覽器版本。
| 屬性 | |||||
|---|---|---|---|---|---|
| outline | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
CSS 語法
outline: outline-width outline-style outline-color|initial|inherit;
屬性值
| 值 | 描述 | 演示 |
|---|---|---|
| outline-width | 指定輪廓的寬度 | 試一試 » |
| outline-style | 指定輪廓的樣式 | 試一試 » |
| outline-color | 指定輪廓的顏色 | 試一試 » |
| initial | 將此屬性設定為其預設值。閱讀關於initial | |
| inherit | 從其父元素繼承此屬性。閱讀關於inherit |
相關頁面
CSS 教程：CSS 輪廓
HTML DOM 參考： outline 屬性
