CSS background-position順序

順序

  1. 一定要在先引入background: url()
    后才來(lái)定義background-position
[class^='icon'] {
    display: inline-block;
    background:url(images/img.png)  no-repeat;
}
.icon-left-select{height:12px;width:7px;background-position:0 0;}
.icon-share{height:12px;width:11px;background-position:0 -15px;}

  1. 這樣background-position才有作用
    如果順序反了的話background會(huì)覆蓋前面設(shè)置的background-posizion導(dǎo)致失效

  2. 該方法常用在配合css sprites來(lái)使用（精靈圖）

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 不會(huì)用代碼框，所以看著有些亂套，，，，html部分 <!DOCTYPE html> 迅雷看看 ...
    這就是個(gè)帥氣的名字閱讀 1,919評(píng)論 0贊 0
  • 1. tab列表折疊效果 html: 能源系統(tǒng)事業(yè)部 崗位名稱： 工作地點(diǎn) 崗位名...
    lilyping閱讀 2,015評(píng)論 0贊 1
  • 彈框有很多中樣式，比如系統(tǒng)的中間彈框，底部彈框還有第三方的MBProgressHuD彈框等等，在本篇文章中小編將帶...
    大臉貓121閱讀 1,996評(píng)論 3贊 4
  • 歲月匆匆流逝，再次返回童年時(shí)的小村莊，已物是人非，順著曾經(jīng)無(wú)數(shù)次走過(guò)的小路，我找到了那個(gè)你曾教會(huì)我漢字的小院，風(fēng)鈴...
    比芯兒閱讀 623評(píng)論 0贊 0
  • 今天的晨讀材料里兩個(gè)詞可以給我?guī)?lái)能量，分別是彎道超車、死磕。 彎道超車:無(wú)論一個(gè)人起點(diǎn)高低，總會(huì)有贏的機(jī)會(huì)，只是...
    在裝翅膀的豬閱讀 310評(píng)論 1贊 3

友情鏈接更多精彩內(nèi)容