CSS3中的outline

CSS3 外輪廓屬性
外輪廓outline在頁(yè)面中呈現(xiàn)的效果和邊框border呈現(xiàn)的效果極其相似，但和元素邊框border完全不同，外輪廓線不占用網(wǎng)頁(yè)布局空間，不一定是矩形，外輪廓是屬于一種動(dòng)態(tài)樣式， 只有元素獲取到焦點(diǎn)或者被激活時(shí)呈現(xiàn)。
-outline- color： 定義輪廓線的顏色，屬性值為CSS中定義的顏色值。在實(shí)際應(yīng)用中，省略時(shí)此參數(shù)的默認(rèn)值為黑色。
-outline- style： 定義輪廓線的樣式，屬性為CSS中定義線的樣式。在實(shí)際應(yīng)用中，省略時(shí)此參數(shù)的默認(rèn)值為 none，省略后不對(duì)該輪廓線進(jìn)行任何繪制。
-outline- width： 定義輪廓線的寬度，屬性值可以為一個(gè)寬度值。在實(shí)際應(yīng)用中，省略時(shí)此參數(shù)的默認(rèn)值為 medium，表示繪制中等寬度的輪廓線。
-outline- offset： 定義輪廓邊框的偏移位置的數(shù)值，此值可以取負(fù)數(shù)值。當(dāng)此參數(shù)的值為正數(shù)值，表示輪廓邊框向外偏離多少個(gè)像素； 當(dāng)此參數(shù)的值為負(fù)數(shù)值， 表示輪廓邊框向內(nèi)偏移多少個(gè)像素。
-inherit： 元素繼承父元素的 outline效果。
輪廓和邊框的對(duì)比
http:/ /www.iis7.com/b/wzjk/
outline和border的對(duì)比outline屬性創(chuàng)建的外輪廓線外表上和border極其相似，但實(shí)際上有明顯的不同。
-border屬于盒模型的一部分，直接影響元素盒子的大小，而outline創(chuàng)建的外輪廓線是畫在一個(gè)框的“上面”，不會(huì)影響該框或任何其他框大小，因此outline 創(chuàng)建的輪廓線不會(huì)影響文檔流， 也不會(huì)破壞網(wǎng)頁(yè)布局。
-outline創(chuàng)建的輪廓線表面上和border一樣， 可以創(chuàng)建輪廓線的顏色、線型樣式、線型粗細(xì)大小，但和border有一點(diǎn)完全不一樣。outline創(chuàng)建的外輪廓線在 元素各邊都一樣， 這和border不一樣，不能像border邊框一樣，設(shè)置outline-top或outline-left之類。
-border創(chuàng)建的元素邊框可以單邊設(shè)置，而outline創(chuàng)建的外輪廓線始終是閉合的。
-outline創(chuàng)建的外輪廓線可能是非矩形的，如果元素是多行， 外輪廓線就至少是能夠包含該元素所有框的外輪廓?？蒪order不一樣， 他將使用一個(gè)邊框包括整個(gè) 元素。
-border僅可以設(shè)置元素的邊框，只能向外擴(kuò)展，而outline創(chuàng)建的外輪廓線，可以通過outline-offset的值，向元素外部（outline-offset值為正值）或向元素內(nèi)部（outline- offset）值為負(fù)值創(chuàng)建封閉的輪廓。