CSS 背景設定

2021-10-02 14:11:21 字數 3024 閱讀 2012

css允許應用純色作為背景,也允許使用背景影象建立相當複雜的效果

background

body

object.style.background=

"white url(*****.gif) repeat-y"

描述background-color規定要使用的背景顏色

background-position規定背景影象的位置

background-size規定背景的尺寸

background-repeat規定如何重複背景影象

background-origin規定背景的定位區域

background-clip規定背景的繪製區域

background-attachment規定背景影象是否固定或者隨著頁面的其餘部分滾動

background-image規定要使用的背景影象

inherit規定應該從父元素繼承background屬性的設定

背景色可以使用background-color屬性為元素設定背景色。這個屬性接受任何合法的顏色值。

p

p

background-color
object.style.backgroundcolor=「#00ff00」

描述color_name

規定顏色值為顏色名稱的背景顏色(比如red)

hex_number

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

rgb_number

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

transparent預設。背景顏色為透明

inherit規定從父元素繼承background-color屬性

背景影象

要把影象放入背景,需要使用background-image屬性。background-image屬性的預設值是none影象。

body

p.flower

a.radio

background-image
object.style.backgroundimage=

"abc.gif"

描述url

指向影象的路徑

none預設值。不顯示背景影象

inherit規定從父元素繼承background-image屬性

背景重複

background-repeat

object.style.backgroundrepeat=

"repeat-y"

描述repeat預設。背景影象將在垂直和水平方向重複

repeat-x背景影象將在水平方向重複

repeat-y背景影象將在垂直方向重複

no-repeat背景影象將僅顯示一次

inherit規定引發i從父元素繼承background-repeat屬性的設定

背景定位

為background-position屬性設定屬性

object.style.backgroundposition=

"center"

關鍵字:top、bottom、left、right和center。

百分數值:50%,75%

body

長度值:100px或5px。

body

background-origin
object.style.backgroundorigin=

"content-box"

描述padding-box背景影象相對於內邊距框來定位

border-box背景影象相對於邊框盒來定位

content-box背景影象相對於內容框來定位

background-clip

object.style.backgroundclip=

"content-box"

描述border-box背景被裁剪到邊框盒

padding-box背景被裁剪到內編輯框

content-box背景被裁剪到內容框

背景關聯

background-attachment

object.style.backgroundattachment=

"fixed"

描述scroll預設。背景影象會隨著頁面其餘部分的滾動而移動

fixed當頁面的其餘部分滾動時,背景影象不會滾動

inherit規定應該從父元素繼承background-attachment屬性的設定

css背景設定

顏色表示方法 background 1 red 英文單詞 2 ff0000 16進製制 3 rgb 255,0,0 3元色 4 rgb 100 0 0 百分比 背景起始位置 background origin padding box border box content box 邊框起始 內邊距起始...

css背景設定

1 background color 背景顏色 2 background image 背景 3 background repeat 背景重複 4 background position 背景位置 5 background size 背景尺寸 6 background attachment 背景粘附 ...

css背景設定

注 所有的 都在中實現 背景色 background color 顏色 背景 背景大小 background size 平鋪 重複 background repeat no repeat 此行表示不平鋪 背景位置 background position 傳值 x y xy可正可負 傳關鍵字 x ce...