繪製於元素周圍的一條線，位於邊框邊緣的外圍，可起到突出元素的作用.不佔據空間.
在IE下不可用.
| 屬性 | 描述 | 備忘 |
| outline | 複合屬性 設定或者檢索對象外的線條輪廓,外輪廓(outline)畫在邊框(border)的外面,不一定是矩形 |
outline:outline-color||outline-style||outline-width |
| outline-color | 設定或檢索對象外的線條輪廓的顏色 | color:顏色 invert:預設值,使用背景色的反色 |
| outline-style | 設定或檢索對象外的線條輪廓的樣式 | none:預設值 dotted:點線外輪廓 dashed:虛線外輪廓 solid:實線外輪廓 double:雙線外輪廓 groove:根據outline-color的值畫3D凹槽外輪廓 ridge:根據outline-color的值畫3D凸槽外輪廓 inset:根據outline-color的值畫3D凹邊外輪廓 outset:根據outline-color的值畫3D凸邊外輪廓 |
| outline-width | 設定或檢索對象外的線條輪廓的寬度 | medium:預設.預設寬度 thin:小於預設寬度 thick:大於預設寬度 length:長度 |
執行個體:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>無標題頁</title> <style type="text/css"> span { border:solid 1px red; display:block; width:200px; } .span1 { outline-style:dotted; } .span2 { outline-style:dashed; } .span3 { outline-style:groove; } .span4 { outline-style:ridge; } .span5 { outline-style:inset; } .span6 { outline-style:outset; } </style></head><body> <span class="span1">111111111</span><br /> <span class="span2">222222222</span><br /> <span class="span3">333333333</span><br /> <span class="span4">444444444</span><br /> <span class="span5">555555555</span><br /> <span class="span6">666666666</span></body></html>
在Firefox下效果
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
