为了账号安全,请及时绑定邮箱和手机立即绑定
.cat-1 i{background-position:0 0;}
.cat-2 i{background-position:0 -24px;}


.cat-6 i{background-position:0 -120px;}
li i{
background:url(http://img1.sycdn.imooc.com//539a950e00015ba500710200.jpg);
display:inline;
width:30px;
height:24px;
float:left;
}

大家参考下
大家都忘记了文本居中
这个老师讲的太快 不适合初学者
使用雪碧图可以大大较少HTTP请求次数。一次下载完毕就可以了。性能上非常好!
哇哦,这个老师声音好好听,,,,,

最新回答 / 六月时光
你这是神坑啊,你的注释错啦<!--补充完整的样式--> 你怎么在css里写html的注释咧,这怎么会有效果啊应该写成/*补充完整的样式*/
表示比较不错!!!!
i标签既然浮动了,那么加display:inline;不是画蛇添足么???
.cat{width:120px;border:1px solid gray;background:#f8f8f8;padding-right:40px;}
&lt;div class=&quot;cat&quot;&gt;
&lt;ul&gt;
&lt;li class=&quot;cat-1&quot;&gt;
&lt;h3&gt;服装内衣&lt;/h3&gt;
&lt;/li&gt;
&lt;li class=&quot;cat-1&quot;&gt;
&lt;i&gt;&lt;/i&gt;
&lt;h3&gt;鞋包配饰&lt;/h3&gt;
&lt;/li&gt;
&lt;li class=&quot;cat-1&quot;&gt;
&lt;i&gt;&lt;/i&gt;
&lt;h3&gt;运动户外&lt;/h3&gt;
&lt;/li&gt;
&lt;/div&gt;
&lt;meta charset=&quot;UTF-8&quot;&gt;
&lt;style&gt;
h3{margin:0;padding:0}
ul{list-style:none}
li h3{font-size:14px;font-weight: 400}
li{display:block;height:31px;line-height:30px;overflow:hidden;border-bottom:1px solid #dedede}
.cat{width:150px;background:#f8f8f8;border:1px solid #bbb}
&lt;/style&gt;
form{width:180px;background:#EBF3FA;padding:10px;}
input{background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg) }
input.user,.key{background:none;border:1px solid #dedede;padding:5px 0; margin-bottom:10px; text-indent:2em;width:180px;}
label{font-size:13px;}
.forget{text-decoration:none;font-size:13px;float:right;}
.enter{display:block;width:180px;height:40px;background-position:0 0;margin:10px 0;}
.regedit{display:block;width:180px;height:40px;background-position:0 -38px;margin:10px 0;}
hr{border:1px solid #dedede;}
课程须知
您至少具备HTML/CSS基础知识。
老师告诉你能学到什么?
1.学会CSS Sprite雪碧图制作方法。2.学会CSS Sprite雪碧图的使用方法。

微信扫码,参与3人拼团

微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消