keywords: 雪碧圖、img與css背景、title與alt、div水平居中、圖片水平居中、元素透明。
-
CSS Sprite(雪碧圖|精靈圖)指什么? 有什么作用。
CSS Sprite是把網(wǎng)頁(yè)中一些背景圖片整合到一張圖片文件中，再利用CSS的“background-image”，“background-repeat”，“background-position”的組合進(jìn)行背景定位，background-position可以用數(shù)字能精確的定位出背景圖片的位置。這樣一來(lái)，當(dāng)訪問(wèn)該頁(yè)面時(shí)，圖片不會(huì)一張一張的慢慢顯示出來(lái)，減少網(wǎng)絡(luò)請(qǐng)求。
-
img標(biāo)簽和CSS背景使用圖片在使用場(chǎng)景上有何區(qū)別。
對(duì)于固定不變的內(nèi)容，如圖標(biāo)等用CSS背景圖。對(duì)于可變的內(nèi)容，圖片是和內(nèi)容相關(guān)的，用img圖片（比如驗(yàn)證碼、用戶頭像、廣告圖片）。
-
title 和 alt屬性分別有什么作用。
title一般起到提示的作用。比如在img標(biāo)簽加屬性title，當(dāng)鼠標(biāo)移動(dòng)到圖片上時(shí)，會(huì)顯示文字提示。
alt是當(dāng)圖片無(wú)法顯示時(shí)，在圖片的位置用預(yù)先設(shè)定的值替代。
-###background: url(abc.png) 0 0 no-repeat;這句話是什么意思。
這是background屬性的簡(jiǎn)寫，分別是:
background-image:url(abc.png) 規(guī)定背景圖像的路徑abc.png;
background-position:0px 0px; 規(guī)定背景圖像的位置、偏移量；
background-repeat:no repeat; 規(guī)定背景圖像不重復(fù);```
- ###background-size有什么作用? 兼容性如何? 常用的值是?
background-size規(guī)定背景圖片的尺寸。常用的值：
cover :把背景圖像擴(kuò)展至足夠大，以使背景圖像完全覆蓋背景區(qū)域。
背景圖像的某些部分也許無(wú)法顯示在背景定位區(qū)域中。
contain：把圖像圖像擴(kuò)展至最大尺寸，以使其寬度和高度完全適應(yīng)內(nèi)容區(qū)域；
px ：給背景圖片指定寬高；
百分比 ：原圖像大小的倍數(shù)```
-
如何讓一個(gè)div水平居中？如何讓圖片水平居中.
div水平居中：對(duì)該div使用margin:0 auto;
圖片水平居中：對(duì)上一級(jí)的塊級(jí)元素使用text-align:center;
-
如何設(shè)置元素透明? 兼容性？
對(duì)元素使用樣式屬性opacity。
-
opacity 和 rgba都能設(shè)置透明，有什么區(qū)別.
opacity是對(duì)元素加透明度（可以是文本、圖像、背景色），而rgba是對(duì)元素加顏色（在此基礎(chǔ)上可以調(diào)節(jié)透明度）。
