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

CSS雪碧圖 即CSS Sprite，也有人叫它CSS精靈圖，是一種CSS圖像合并技術，該方法是將小圖標和背景圖像合并到一張圖片上，然后利用css的背景定位來顯示需要顯示的圖片部分。

img標簽和CSS背景使用圖片在使用場景上有何區別

img作為html標簽，img使用的圖片一般作為內容。
而CSS背景使用圖片一般是用來修飾。
往更詳細的方向上來說在網頁加載的過程中，以css背景圖存在的圖片會等到結構加載完成（網頁的內容全部顯示以后）才開始加載，而html里的img標簽是網頁結構（內容）的一部分會在加載結構的過程中加載。圖片做為背景，在圖片沒加載的時候或者加載失敗的時候，不會有個圖片的占位標記，不會出現紅叉。

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

title 屬性規定關于元素的額外信息。這些信息通常會在鼠標移到元素上時顯示一段工具提示文本。alt屬性它規定在圖像無法顯示時的替代文本。

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

這句話為background的簡寫形式，url代表的是background-image插入背景圖片的地址，0 0代表的是background-position的值，表示背景圖的定位，前后兩個分別是橫向定位和縱向定位。左上角是 0 0，no-repeat代表background-repeat的值?？墒褂玫闹涤衦epeat、no-repeat、repeat-x、repeat-y、inherit。分別表示水平垂直重復、不重復、僅水平重復、僅垂直重復、繼承自父輩元素。

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

background-size兼容性

常用的值有auto|length|cover|contain|initial|inherit;

如何讓一個div水平居中？如何讓圖片水平居中

div水平居中：
1.外邊距法：通過對div設置外邊距，margin:0 auto；
2.display:inline-block法:父元素設置text-align:center。需要劇中的div設置display:inline-block即可。
3.浮動法：對div及其父元素float:left，相對定位，父元素left50%，div right 50%。
圖片水平居中：將圖片放入塊級元素中，使用上述方法。

如何設置元素透明? 兼容性？

可以通過rgba和opcity設置語速透明度，針對ie8及更糟版本的瀏覽器需要添加 filter:alpha(opacity=x)。

opacity和rgba都能設置透明，有什么區別？

opacity會繼承父元素的 opacity 屬性，而RGBA設置的元素的后代元素不會繼承不透明屬性。

 html head meta charset= UTF-8 title Document /title style type= text/css  .rgba,.opacity{ margin:0 auto; width:200px; height: 200px; text-align: center; line-height: 200px; font-size: 20px; border:1px solid black; } .rgba{ background: rgba(255,0,0,0.5); } .opacity{ background: red; opacity: 0.5; } /style /head body div >
，可以證明opacity可以繼承父元素的屬性。此外，opacity也可以設置圖片的透明度。
相信看了本文案例你已經掌握了方法，更多精彩請關注php 其它相關文章！
相關閱讀：
JS的閉包與定時器
JS的時間對象與引用類型
用最簡單的前端技術制作一個簡潔的音樂播放器
以上就是CSS常見樣式的詳細內容，html教程        
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。