你所不知道的background

2021-09-11 12:12:47 字數 916 閱讀 8284

今天要說說css中background這個屬性裡面的大學問。

在乙個宣告中設定所有的背景屬性:

body

看到這串**你怕了嗎?知道他們都代表啥意思嘛?不要捉急,來看展開式。

展開式:

background-color設定元素的背景顏色,不能設定到外邊距,可以繼承父級的背景顏色,預設為透明。

background-position設定背景的位置,有瀏覽器相容問題

background-size設定背景的尺寸

第三中設定方式和第四種設定方式之間的區別建議親自測試體會

background-repeat設定重複方法,這個其實沒啥說的,五種情況(水平垂直都重複,僅水平重複,僅垂直重複,不重複,繼承父元素)

background-origin規定背景的定位區域,這裡用到盒模型的概念,結合background-position一起使用。

background-clip設定背景的繪製區域,預設情況下背景會延伸到邊框區域的下層(設定虛線邊框去體會)

background-attachment設定背景隨頁面部分的滾動情況(今天的重點)

background-image設定背景,這個也不必多說,url設定路徑。

這些屬性值都可以從父級繼承,但是ie瀏覽器不行

注意:任何版本的 internet explorer (包括 ie8)都不支援屬性值 "inherit"

你所不知道的 const

const 常量是不可修改的,也就是說only read,例如 const int nbuffsize 512 nbuffsize 0 error就是因為const 常量不能修改,所以定義時必須初始化預設在全域性作用域中定義的非const變數可以在整個程式中訪問,例如 int ncounter ex...

overflow hidden 你所不知道的事

overflow hidden 你所不知道的事 overflow hidden這個css樣式是大家常用到的css樣式,但是大多數人對這個樣式的理解僅僅侷限於隱藏溢位,而對於清除浮動這個含義不是很了解。這是乙個常用的div寫法,下面我們來書寫樣式。大家可以在dmx中自己做試驗 wai nei 可以看到...

你所不知道的 Console

1.凡人視角 列印字串 console.log i am a 凡人 列印提示訊息 console.info yes,you arm a 凡人 列印警告訊息 console.warn 凡人你居然敢窺視我 列印錯誤訊息 console.error 天兵天將,把這個凡人給我打入地獄 列印除錯資訊 cons...