1.CSS Sprite(雪碧圖|精靈圖)指什么? 有什么作用?
將一些零碎的圖片整合到一起,這樣在加載網(wǎng)頁時(shí)候可以省去多次請(qǐng)求的時(shí)間.一般用于頁面上的多個(gè)icon圖標(biāo)的整合,使用恰當(dāng)?shù)?code>background-position進(jìn)行定位.
2.img標(biāo)簽和CSS背景使用圖片在使用場(chǎng)景上有何區(qū)別?
<img>
寫在html的文件中,用于展示圖片或者承接鏈接,為可替換元素.
css背景使用圖片是一種背景展現(xiàn)的方式,用于頁面上圖標(biāo)的展示.
3.background: url(abc.png) 0 0 no-repeat;這句話是什么意思?
background
4.background-size有什么作用? 兼容性如何? 常用的值是?
background-size
屬性規(guī)定背景圖像的尺寸.
background-size
常用值
value | 釋義 |
---|---|
<length> |
設(shè)置背景圖像的高度和寬度。第一個(gè)值設(shè)置寬度,第二個(gè)值設(shè)置高度区赵。如果只設(shè)置一個(gè)值悴灵,則第二個(gè)值會(huì)被設(shè)置為 "auto"襟雷。 |
<percentage> |
以父元素的百分比來設(shè)置背景圖像的寬度和高度伤极。第一個(gè)值設(shè)置寬度蒿涎,第二個(gè)值設(shè)置高度。如果只設(shè)置一個(gè)值移斩,則第二個(gè)值會(huì)被設(shè)置為 "auto"。 |
<auto> |
以背景圖片原始大小縮放背景 |
<cover> |
把背景圖像擴(kuò)展至足夠大绢馍,以使背景圖像完全覆蓋背景區(qū)域向瓷。背景圖像的某些部分也許無法顯示在背景定位區(qū)域中。 |
<contain> |
將背景圖片放大至完全填充背景區(qū)域. |
5.如何讓一個(gè)div水平居中舰涌?如何讓圖片水平居中?
margin:0px auto
讓一個(gè)div水平居中.多數(shù)用于使整個(gè)內(nèi)容區(qū)居中與頁面.
運(yùn)用此方法時(shí),一定要先定義div的寬度.
圖片居中也可以使用這個(gè)方法.
6.如何設(shè)置元素透明? 兼容性猖任?
通過rgba和opacity
opacity兼容性
Paste_Image.png
rgba兼容性
Paste_Image.png
opacity 設(shè)置透明度會(huì)使子元素也透明,有繼承性,作用于元素,以及元素內(nèi)的所有內(nèi)容的透明度.
rgba 設(shè)置透明度沒有繼承性 只作用于元素的顏色或其背景色