CSS 參考手冊

CSS @規(guī)則(RULES)

outline-style CSS屬性設(shè)置元素輪廓的樣式。但是，在工作中,我們更偏向于使用outline這個簡寫屬性。

下表為此屬性的用法說明和版本歷史記錄，以及該屬性在javascript腳本中的使用語法。

默認值：	none
適用于：	所有元素
繼承：	沒有
可動畫制作：	否。請參見動畫屬性。
版本：	CSS 2、3
JavaScript語法：	object.style.outlineStyle="dotted"

該屬性的語法如下：

outline-style: none | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit

下面的示例演示了如何使用outline-style屬性。

示例

  p {
   outline-style: double;
   outline-width: 5px;
  }

下表描述了此屬性的值。

值	描述
none	沒有輪廓顯示。這是默認值。
dotted	將輪廓顯示為一系列點。
dashed	將輪廓顯示為一系列短線段，即破折號。
solid	將輪廓顯示為單條實線。
double	將輪廓顯示為兩條平行的實線，并在它們之間留有一定的間隔。兩條線的總和以及它們之間的間距等于outline-width的值。
groove	顯示雕刻到畫布中的輪廓。它給人以3D的印象，通常是通過創(chuàng)建兩種顏色的陰影來實現(xiàn)的，而這兩種顏色的陰影要比的outline-color顏色稍亮和暗。
ridge	顯示與效果相反的輪廓groove。它還給人以3D的印象，輪廓看起來好像是從畫布中出來的。
inset	顯示使元素框看起來像嵌入在畫布中的輪廓。它給人以3D的印象，通常是通過創(chuàng)建兩種顏色的陰影來實現(xiàn)的，而這兩種顏色的陰影要比outline-color的顏色稍亮和暗。
outset	顯示與效果相反的輪廓inset。它還給人以3D的印象，輪廓使盒子看起來好像從畫布中出來。
initial	將此屬性設(shè)置為其默認值。
inherit	如果指定，則關(guān)聯(lián)元素采用其父元素outline-style的屬性值。

outline-style屬性瀏覽器的兼容性，下表中的數(shù)字表示支持該屬性的瀏覽器最低版本號；所有主流瀏覽器均支持該屬性。

	Firefox 1.5以上 Google Chrome1+ Internet Explorer 8+ Apple Safari 1.2+ Opera 7+

警告： Internet Explorer 7和更早版本不支持該outline-style屬性。IE8支持此屬性，但需要一個<!DOCTYPE>。

請參考有關(guān)以下內(nèi)容的教程：CSS輪廓，CSS邊框。