cursor屬性繼承屬性，指定當滑鼠游標進入元素區域時的形狀。實際的形狀會因使用者環境的不同而稍微不同。
| 屬性 | 適用元素 | 屬性值 | 說明 |
|---|---|---|---|
| cursor | all | auto(Default值) crosshair default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait progress help URI inherit |
→ 系統自動指定 → 十字線 → 各OS系統(window、MC)的初期值 → 手指頭形狀 → 四方箭頭形狀 → 右方托曳形狀 → 右上方托曳形狀 → 左上方托曳形狀 → 上方托曳形狀 → 右下方托曳形狀 → 左下方托曳形狀 → 下方托曳形狀 → 左方托曳形狀 → 選擇TEXT的「I」字形狀 → 等待中形狀 → 執行中形狀 → 問號形狀 → 形狀圖像的所在位置 → 強制繼承上層元素的屬性值 |
.auto { cursor:auto; }
.crosshair { cursor:crosshair; }
.default { cursor:default ; }
.pointer { cursor:pointer ; }
.move { cursor:move ; }
.e-resize { cursor:e-resize; }
.ne-resize { cursor:ne-resize ; }
.nw-resize { cursor:nw-resize ; }
.n-resize { cursor:n-resize; }
.se-resize { cursor:se-resize ; }
.sw-resize { cursor:sw-resize; }
.s-resize { cursor:s-resize; }
.w-resize { cursor:w-resize ; }
.text { cursor:text ; }
.wait { cursor:wait ; }
.progress { cursor:progress ; }
.help { cursor:help ; }
選我就知道我的滑鼠游標形狀
outline屬性非繼承屬性，設定輪廓線的顏色(outline-color)、種類(outline-style)、粗細(outline-width)。沒有設定的順序，以半形空白做區隔。輪廓線和框線不同，輪廓線是描繪在框線的外圍，不會影響的區塊的位置、大小等(框線的粗細會影響)，形狀也不一定會是矩形。常用於在超連結、輸入欄位、選擇按鈕時出現輪廓的效果。
| 屬性 | 適用元素 | 屬性值 | 說明 |
|---|---|---|---|
| outline | all | outline-color outline-style outline-width inherit |
→ 指定輪廓線的顏色 → 指定輪廓線的種類 → 指定輪廓線的粗細 → 強制繼承上層元素的屬性值 |
.outline { outline:gray solid 3px;}
.outline a:hover { outline:orange solid 3px; }
outline-color屬性非繼承屬性，設定輪廓線的顏色。
| 屬性 | 適用元素 | 屬性值 | 說明 |
|---|---|---|---|
| outline-color | all | 顏色 invert(Default初期值) inherit |
→ 16進位的RGB值、Color Name → 該當元素的背景顏色反轉 → 強制繼承上層元素的屬性值 |
.outline { outline:solid 3px;outline-color:gray;}
.outline a:hover { outline:solid 3px;outline-color:orange ; }
outline-style屬性非繼承屬性，設定輪廓線的種類(可以參考bord-style屬性值)。
| 屬性 | 適用元素 | 屬性值 | 說明 |
|---|---|---|---|
| outline-style | all | none hidden dotted dashed solid double groove ridge inset outset inherit |
→ 不設框線，borde-width強制變成"0" → 隱藏框線 → 點線 → 破線 → 實線 → 雙線 → 立體線(凹陷) → 立體線(凸起) → 立體線(左上凹陷) → 立體線(左上凸起) → 強制繼承上層元素的屬性值 |
.outline { outline:gray 3px;outline-style:solid ;}
.outline a:hover { outline:orange 3px;outline-style:solid ; }
outline-width屬性非繼承屬性，設定輪廓線的粗細(可以參考bord-width屬性值)。
| 屬性 | 適用元素 | 屬性值 | 說明 |
|---|---|---|---|
| outline-width | all | 長度 thin medium thick inherit |
em、px等長度(相對、絕對單位)值(不可為負數) → 細線 → 標準 → 粗線 → 強制繼承上層元素的屬性值 |
.outline { outline:gray solid ;outline-width:3px;}
.outline a:hover { outline:orange solid;outline-width:3px ; }