CSS Sprite雪碧图应用_技术问答

首页免费课 CSS Sprite雪碧图应用问答

CSS Sprite雪碧图应用

                
                远人
            Web前端工程师

                    查看讲师更多课程 
                    远人讲师的其他课程
                
电商网站前端架构
中级·101321
免费课程
                                
固定边栏滚动特效
初级·38896
免费课程
                                
认识响应式布局
中级·132133
免费课程
                                
Fiddler工具使用
中级·63507
免费课程
                                
                难度初级
            
                时长 1小时 0分
            
                学习人数
            
综合评分9.73
                            188人评价
                        查看评价
                                9.8
                                内容实用
                            
                                9.8
                                简洁易懂
                            
                                9.6
                                逻辑清晰

全部评论问答未解决精华

sunshine_haha

CSS display:inline和float:left两者区别

①display:inline:任何不是块级元素的可见元素都是内联元素。其表现的特性是“行布局”形式!(行布局:其表现形式始终以行进行显示) ②float:left:指定元素脱离普通的文档流而产生的特别的布局特性。并且float必需应用在块级元素之上，也就是说浮动并不应用于内联标签。或者可以说如果应用了float这个元素将被指定为块级元素。那么两者的区别显而易见:display:inline元素不能设置宽高，因为它属于行布局，其特性是在一行里进行布局，所以不能被设定宽高

0 3-3 CSS Sprite 应用

2016-07-31

qq_慵懒的树袋熊_03195862

li i{background:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);display:inline;float:left;width:188px;height:38px;}
ul{list-style:none;}
.denglu i{background-position:0 0;}
.zhuce i{background-position:0 -36px;}
</style>
</head>

0 4-1 编程挑战

2016-07-31

qq_慵懒的树袋熊_03195862

*{margin:0;padding:0;}
input{height:30px;padding-left:10px;}
.one{margin-top:20px;}
.two{font-size:12px;padding-left:5px;position:absolute;bottom:10px;}
.loginbox{position:relative;}
li{font-size:20px;font-weight:normal;height:30px;width:170px;text-align:center;margin-top:30px;}

0 4-1 编程挑战

2016-07-31