[Back To Basic] css - outline

Outline在border的外圍加上”一條線”，讓HTML元素更明顯，主要目的就是強調HTML元素。其特性如下

• 不像margin會加上留白
• 有可能會覆蓋到其他元素
• Outline的寬度不算在width和總寬度內

property

• outline-style(必要)
• outline-color: 有個invert可以使用，反轉顏色(實驗後，顏色會等同於color)，確保outline的存在感
• outline-width
• outline-offset
• outline

簡寫

e.g. Outline: 5px solid yellow;

可包含以下三個資訊，順序不重要

• outline-width
• outline-style (必要)
• outline-color

offset

outline-offset 這個屬性可以在outline和border之間增加空白(透明的)

e.g. outline-offset: 15px;