盒模型包括哪些屬性？

盒子模型包括content，margin，border，padding屬性。

text-align: center的作用是什么，作用在什么元素上？能讓什么元素水平居中？

• 作用：使兩端對(duì)齊
• 作用在塊元素上
• 讓塊元素里的行內(nèi)元素水平居中

如果遇到一個(gè)屬性想知道兼容性，在哪查看?
在caniuse查看

IE 盒模型和W3C盒模型有什么區(qū)別?

• ie盒模型：在代碼中寫的寬度實(shí)際等于：border寬度+padding寬度+內(nèi)容寬度
• w3c盒模型：在代碼中寫的寬度實(shí)際等于：內(nèi)容寬度

以下代碼的作用？兼容性？

*{
 box-sizing: border-box;
}

• 作用：一個(gè)塊級(jí)元素實(shí)際所占寬高度=外邊距（margin）+ 邊界寬度(border-width) + 內(nèi)邊距（padding）+ 高度（height） / 寬度（width） 如果設(shè)置了border-box，實(shí)際所占寬高度 = 設(shè)置的高度（height）/ 設(shè)置的寬度（width）+ 外邊距（margin）
• 兼容性

CSS Sprite(雪碧圖|精靈圖)指什么? 有什么作用

• Css Sprite是一種網(wǎng)頁(yè)圖片應(yīng)用處理方式。
• 它允許你將一個(gè)頁(yè)面涉及到的所有零星圖片都包含到一張大圖中去，這樣一來(lái)，當(dāng)訪問(wèn)該頁(yè)面時(shí)，載入的圖片就不會(huì)像以前那樣一幅一幅地慢慢顯示出來(lái)了。

img標(biāo)簽和CSS背景使用圖片在使用場(chǎng)景上有何區(qū)別

• img標(biāo)簽適用于經(jīng)常更換的圖片
• Css背景適用于不經(jīng)常更換的圖片

title和 alt屬性分別有什么作用？

• title是補(bǔ)充原來(lái)的內(nèi)容，當(dāng)鼠標(biāo)懸停在鏈接的時(shí)候顯示鏈接信息。
• alt是當(dāng)圖片不能顯示的時(shí)候，代替圖片內(nèi)容。

background: url(abc.png) 0 0 no-repeat;這句話是什么意思？

• 用abc.png做背景圖片，圖片的位置就是（0,0），圖片不重復(fù)顯示。

background-size有什么作用? 兼容性如何? 常用的值是?

• 作用是設(shè)置背景圖像的尺寸與顯示效果，解決針對(duì)響應(yīng)式布局的背景圖片自適應(yīng)。
• 兼容性

如何讓一個(gè)div水平居中？如何讓圖片水平居中

• div水平居中設(shè)置margin:0 auto;
• 圖片水平居中：text-align：center；

如何設(shè)置元素透明? 兼容性？
background-color:rgba()中的第四位值設(shè)置為0_{1的數(shù)字，或者opacity設(shè)置0}1的數(shù)字，但是這兩種方法ie8及其之前的版本都不兼容，可以使用filter:alpha(opacity=50);兼容。

opacity 和 rgba都能設(shè)置透明，有什么區(qū)別?

• background-color:rgba()是針對(duì)背景顏色的，所以文字沒(méi)有透明效果；
• 而opacity針對(duì)整個(gè)元素塊，元素塊中的文字也會(huì)變透明。

代碼一
代碼二&三