中文字幕在线无码一区二区三区,四虎成人精品永久网站

首頁免費(fèi)課 CSS Sprite雪碧圖應(yīng)用問答

CSS Sprite雪碧圖應(yīng)用

                
                遠(yuǎn)人
            Web前端工程師

                    查看講師更多課程 
                    遠(yuǎn)人講師的其他課程
                
電商網(wǎng)站前端架構(gòu)
中級·101305
免費(fèi)課程
                                
固定邊欄滾動特效
初級·38882
免費(fèi)課程
                                
認(rèn)識響應(yīng)式布局
中級·132093
免費(fèi)課程
                                
Fiddler工具使用
中級·63796
免費(fèi)課程
                                
                難度初級
            
                時長 1小時 0分
            
                學(xué)習(xí)人數(shù)
            
綜合評分9.73
                            188人評價
                        查看評價
                                9.8
                                內(nèi)容實(shí)用
                            
                                9.8
                                簡潔易懂
                            
                                9.6
                                邏輯清晰

全部評論問答未解決精華

陽光雨下

我納悶為啥inline能設(shè)置寬高，后來想到浮動會把元素轉(zhuǎn)換成inline-block元素。= =好吧。設(shè)置<i>的inline與<li>的block意義在哪。。

2 3-3 CSS Sprite 應(yīng)用

2015-12-03

陽光雨下

*{margin:0;padding:0;}
ul{list-style;none;}
li h3{font-size:14px;font-weight:400;text-align:center;}
li{display:block;width:130px;height:31px;line-height:31px;overflow:hidden;border-bottom:1px solid #dedede;margin:0 auto;}
.cat{width:150px;background:#f8f8f8;border:1px solid #bbb;}

0 3-2 編程練習(xí)

2015-12-02

小豬版納

建議：技巧是好的，能結(jié)合 margin屬性值為負(fù)數(shù)的情況一起講解比較好，以第四象限為基準(zhǔn)盡快能達(dá)到效果，卻是不容易理解。還有那個width:30px后面的分號。imooc發(fā)展太快，細(xì)小的錯誤好多，希望繼續(xù)改進(jìn)吖。
margin:30px 后面少了個分號吖?。。。?/div>

0 3-4 編程練習(xí)

2015-12-02

羽緣

.cat-1 i{background-position:0 0;}
.cat-2 i{background-position:0 -24;}
.cat-3 i{background-position:0 -48;}
.cat-4 i{background-position:0 -72;}
.cat-5 i{background-position:0 -96;}
.cat-6 i{background-position:0 -120;}
.cat-7 i{background-position:0 -144;}
.cat-8 i{background-position:0 -168;}

0 3-4 編程練習(xí)

2015-12-02

羽緣

li i {
background:url(http://img1.sycdn.imooc.com//539a950e00015ba500710200.jpg);
}

0 3-4 編程練習(xí)

2015-12-02

單單happy

因?yàn)橛眠^雪碧圖，正好1個小時，就點(diǎn)進(jìn)來看，老師確實(shí)帥呆了。http://www.spritecow.com/這個網(wǎng)址用起來還不錯。

1 1-2 CSS Sprite雪碧圖實(shí)現(xiàn)原理

2015-12-02

魚小水

這個老師的口語真是這些老師里最標(biāo)準(zhǔn)的了!!!喜歡!!!

1 1-1 CSS Sprite雪碧圖使用場景

2015-11-24

筱余

最后一個分號確實(shí)可以不寫，但是添加新代碼是要記得補(bǔ)上。

1 3-4 編程練習(xí)

2015-11-20

smartone

老師這出得好，代碼寫對了，還得注意小細(xì)節(jié)，小小的一個分號，已經(jīng)讓很多同學(xué)抓狂了，哈哈

0 3-4 編程練習(xí)

2015-11-20

慕碼人0911192

慢慢撥開了以前的疑惑！

0 1-1 CSS Sprite雪碧圖使用場景

2015-11-20

zly201010

喜歡這個老師的課程，語速慢，講得也詳細(xì)。

1 1-1 CSS Sprite雪碧圖使用場景

2015-11-17

慕后端8523537

在li i中添加一句background
.cat-2 i{background-position:0 -24px;}
.cat-3 i{background-position:0 -72px;}
.cat-4 i{background-position:0 -96px;}
.cat-5 i{background-position:0 -120px;}
.cat-6 i{background-position:0 -144px;}
.cat-7 i{background-position:0 -168px;}
.cat-8 i{background-position:-40px 0;}

0 3-4 編程練習(xí)

2015-11-16