CSS outline 屬性 · W3School CSS 參考手冊

# CSS outline 屬性 ## 實例設置 4 個邊框的樣式： ``` p { outline:#00FF00 dotted thick; } ``` ## 瀏覽器支持所有瀏覽器都支持 outline 屬性。注釋：如果規定了 !DOCTYPE，則 IE8 支持 outline 屬性。 ## 定義和用法 outline （輪廓）是繪制于元素周圍的一條線，位于邊框邊緣的外圍，可起到突出元素的作用。注釋：輪廓線不會占據空間，也不一定是矩形。 outline 簡寫屬性在一個聲明中設置所有的輪廓屬性。可以按順序設置如下屬性： * outline-color * outline-style * outline-width 如果不設置其中的某個值，也不會出問題，比如 outline:solid #ff0000; 也是允許的。 | 默認值： | invert none medium | | --- | --- | | 繼承性： | no | | --- | --- | | 版本： | CSS2 | | --- | --- | | JavaScript 語法： | _object_.style.outline="#0000FF dotted thin" | | --- | --- | ## 可能的值 | 值 | 描述 | | --- | --- | | _outline-color_ | 規定邊框的顏色。參閱：[outline-color](pr_outline-color.asp "CSS outline-color 屬性") 中可能的值。 | | _outline-style_ | 規定邊框的樣式。參閱：[outline-style](pr_outline-style.asp "CSS outline-style 屬性") 中可能的值。 | | _outline-width_ | 規定邊框的寬度。參閱：[outline-width](pr_outline-width.asp "CSS outline-width 屬性") 中可能的值。 | | inherit | 規定應該從父元素繼承 outline 屬性的設置。 | ## TIY 實例 [在元素周圍畫線](/tiy/t.asp?f=csse_outline) 本例演示使用 outline 屬性在元素周圍畫一條線。 ``` <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style type="text/css"> p { border:red solid thin; outline:#00ff00 dotted thick; } </style> </head> <body> <p><b>注釋：</b>只有在規定了 !DOCTYPE 時，Internet Explorer 8 （以及更高版本）才支持 outline 屬性。</p> </body> </html> ``` ## 相關頁面 CSS 教程：[CSS 輪廓](/css/css_outline.asp "CSS 輪廓") HTML DOM 參考手冊：[outline 屬性](/jsref/prop_style_outline.asp "HTML DOM outline 屬性")