CSS輪廓設定

2021-10-02 17:14:12 字數 1682 閱讀 1610

輪廓(outline)是繪製於元素周圍的一條線,位於邊框邊緣的外圍,可起到突出元素的作用。

設定輪廓樣式

outline-style

object.style.outlinestyle=

"dotted"

描述none預設。定義無輪廓。

dotted定義點狀的輪廓。

dashed定義虛線輪廓。

solid定義實線輪廓。

double定義雙線輪廓。雙線的寬度等同於outline-width的值。

groove定義 3d 凹槽輪廓。此效果取決於outline-color值。

ridge定義 3d 凸槽輪廓。此效果取決於outline-color值。

inset定義 3d 凹邊輪廓。此效果取決於outline-color值。

outset定義 3d 凸邊輪廓。此效果取決於outline-color值。

inherit規定應該從父元素繼承輪廓樣式的設定。

設定輪廓顏色

object.style.outlinecolor=

"#0000ff"

描述color_name

規定顏色值為樣冊名稱的輪廓顏色(比如red)

hex_number

規定顏色值為十六進製制值的輪廓顏色(比如#ff0000)

rgb_number

規定顏色值為rgb**的輪廓顏色(比如rgb(255,0,0))

invert預設。執行顏色反轉(逆向的顏色)。

可使輪廓在不同的背景顏色中都是可見。

inherit規定應該從父元素繼承輪廓顏色的設定。

設定輪廓的寬度

object.style.outlinewidth=

"thin"

描述thin規定細輪廓

medium預設。規定中等的輪廓

thick規定粗的輪廓

length

允許您規定輪廓粗細的值

inherit規定應該從父元素繼承輪廓寬度的設定

簡寫輪廓樣式

outline

object.style.outline=

"#0000ff dotted thin"

demo
>

>

type

="text/css"

>

pstyle

>

head

>

>

>

中國加油! 武漢加油!p

>

body

>

html

>

?執行結果?

CSS 設定或消除邊框外圍輪廓線

outline用於設定元素邊框外圍的輪廓線,是乙個綜合性的屬性,可以設定邊框線的顏色 樣式和粗細 屬性 簡寫形式 outline outline color outline style outline width 示例 outline red dashed 2px 在實際的開發過程中很少使用上述的 ...

css 輪廓 陰影 圓角

outline 用來設定元素的輪廓線,用法和border一模一樣 輪廓和邊框不同的點,就是輪廓不會影響到可見框的大小 doctype html en utf 8 viewport content width device width,initial scale 1.0 輪廓和圓角 title box...

CSS屬性 陰影 輪廓 漸變

注 本文摘自 寧靜致遠 csdn 但願人長久 千里共嬋娟 csdn 使用box shadow屬性可以為元素新增陰影效果,比如 關鍵字是否必須作用值 h shadow 是陰影的水平偏移量 長度值,正值代表陰影向右偏移,負值代表陰影向左偏移 v shadow 是陰影的垂直偏移量 長度值,正值代表陰影向下...