CSS中的outline屬性用于設置元素的輪廓線。輪廓線是一條圍繞元素的線條,常常用于強調元素或提供視覺反饋。
.element { outline: 2px solid black; }
上面的代碼將元素的輪廓線設置為2像素粗的黑色實線。
除了顏色和寬度之外,outline屬性還可以設置其他屬性值。例如,outline-style可以設置輪廓線的樣式,包括:實線、虛線、點狀線、雙實線等等。outline-offset可以設置輪廓線距離元素邊緣的距離。
.element { outline: 2px dashed red; outline-offset: 10px; }
上面的代碼將元素的輪廓線設置為2像素寬的紅色虛線,并且距離元素邊緣10像素。
需要注意的是,輪廓線不會占據元素的空間,不會改變元素的大小或布局。當一個元素被輪廓線包圍時,輪廓線會在元素外面繪制,不會和元素的邊緣重疊。
outline屬性也可以應用于文本元素,用于在文本周圍創建一個輪廓線。這個功能通常用于創建帶有描邊的文本效果。
.text { outline: 2px solid blue; }
上面的代碼將文本元素的輪廓線設置為2像素寬的藍色實線。
總之,outline屬性是一個非常有用的CSS屬性,可以用于增強元素的可視化效果并提供視覺反饋。它可以幫助你創建漂亮的UI設計,并且非常容易使用。