讓客戶滿意是我們工作的目標，不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術通過有效、簡單的方式提供給客戶，將通過不懈努力成為客戶在信息化領域值得信任、有價值的長期合作伙伴，公司提供的服務項目有：域名與空間、網絡空間、營銷軟件、網站建設、江油網站維護、網站推廣。

輪廓和邊框看起來非常相似，但它們之間也并非沒有區(qū)別，例如：

• 元素上下左右四個方向上邊框的樣式、寬度、顏色可以單獨設置，而輪廓在元素四個方向的寬度、樣式、顏色都是相同的，不能單獨設置；
• 邊框的寬度會直接影響元素的尺寸，而輪廓不會占用頁面空間，不會影響頁面的布局，但是輪廓會與頁面上的其它元素發(fā)聲重疊；
• 除了會與周圍的元素發(fā)聲重疊外，輪廓對周圍的元素沒有任何影響；
• 邊框是元素尺寸的一部分，而輪廓不是，也就是說無論輪廓的寬度是多少，元素的尺寸都不會改變；
• 輪廓可以不是矩形的，但您不能直接創(chuàng)建圓形輪廓。

您可以使用下面幾個屬性來為元素設置輪廓：

• outline-color：設置輪廓的顏色；
• outline-style：設置輪廓的樣式；
• outline-width：設置輪廓的寬度；
• outline：輪廓的簡寫屬性，可以使用 outline 屬性中同時設置上面的三個輪廓屬性；
• outline-offset：設置輪廓與邊框之間的距離。

1. outline-style

outline-style 屬性可以設置輪廓得樣式，屬性得可選值如下所示：

【示例】使用 outline-style 屬性設置輪廓的樣式：

    


    dotted
    dashed
    solid
    double
    groove
    ridge
    inset
    outset

運行結果如下圖所示：

注意：因為輪廓的默認樣式為 none，所以您必須指定輪廓的樣式才可以使輪廓顯示在元素周圍。

2. outline-width

outline-width 屬性用來設置輪廓的寬度，只有當 outline-style 屬性的值不為 none 時，outline-width 屬性才會生效。outline-width 屬性的可選值如下：

【示例】使用 outline-width 屬性設置輪廓的寬度：

運行結果如下圖所示：

3. outline-color

outline-color 屬性用來設置輪廓的顏色，屬性的可選值如下：

注意：如果只設置 outline-width 或 outline-color 屬性的話，輪廓的設置并不會生效。您必須使用 outline-style 屬性設置了輪廓的樣式之后，才可以使用 outline-width 和 outline-color 屬性來設置輪廓的寬度和顏色。

【示例】使用 outline-color 屬性設置輪廓的顏色：

    


    
red
    
#AAA
    
rgb(217, 0, 217)

運行結果如下圖所示：

4. outline

outline 屬性是上述 outline-width、outline-style、outline-color 三個屬性的簡寫形式，使用 outline 屬性可以同時設置這三個屬性中的一個或多個，語法格式如下：

outline: outline-width outline-style outline-color;

在使用 outline 屬性時，outline-width、outline-style、outline-color 這幾個參數的順序并不是固定的，您可以按照上面語法中介紹的順序，也可以根據自己的喜好改變它們的順序。

【示例】使用 outline 屬性設置元素的輪廓：

    


    
red
    
#AAA
    
rgb(217, 0, 217)

運行結果如下圖所示：

5. outline-offset

默認情況下輪廓是緊貼著邊框的，通過 outline-offset 屬性可以設置輪廓與邊框之間的距離，屬性的可選值如下：

【示例】使用 outline-offset 設置輪廓與邊框之間的距離：

運行結果如下圖所示：