課程
/前端開發(fā)
/JavaScript
/側(cè)欄工具條開發(fā)
一直沒(méi)有弄懂圖片的路徑問(wèn)題,不是有很多張圖片嗎?為什么只有一個(gè)引用路徑。不應(yīng)該是在每一個(gè)class都要引用一個(gè)路徑嗎?
2018-04-18
源自:側(cè)欄工具條開發(fā) 2-3
正在回答
.toolbar-item,.toolbar-layer{
? background-image:url(../img/toolbar.png);
? background-repeat:no-repeat;
}
它給每一個(gè)a標(biāo)簽都用了一個(gè).toolbar-item類,也就意味著每一個(gè)a都有一個(gè)背景圖片路徑。而把所有的圖片都集中在一張圖片上,且控制a的寬高顯示部分圖片,以及通過(guò)在這張圖片上定位(background-position:定位圖片上的位置,而不是圖片在body里的位置),就可以實(shí)現(xiàn)一張圖片顯示多個(gè)a上的圖片顯示。
慕前端7781183 提問(wèn)者
舉報(bào)
帶動(dòng)畫效果的工具條,掌握如何用CSS3完成簡(jiǎn)單的動(dòng)畫效果
1 回答圖片路徑寫對(duì)了鼠標(biāo)懸浮不顯示
6 回答有沒(méi)有辦法改變 koala 中 css 的編譯路徑 ?
1 回答圖片顯示為什么不直接用display:none / display:block 呢
6 回答代碼都一樣的,為什么看不到圖片啊
1 回答第一次顯示的圖片都能顯示,第二次的圖片引入出現(xiàn)如下錯(cuò)誤:
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2018-04-28
.toolbar-item,.toolbar-layer{
? background-image:url(../img/toolbar.png);
? background-repeat:no-repeat;
}
它給每一個(gè)a標(biāo)簽都用了一個(gè).toolbar-item類,也就意味著每一個(gè)a都有一個(gè)背景圖片路徑。而把所有的圖片都集中在一張圖片上,且控制a的寬高顯示部分圖片,以及通過(guò)在這張圖片上定位(background-position:定位圖片上的位置,而不是圖片在body里的位置),就可以實(shí)現(xiàn)一張圖片顯示多個(gè)a上的圖片顯示。