码迷,mamicode.com
首页 > 其他好文 > 详细

你可能不知道的行内元素和块元素最主要的区别

时间:2016-05-22 16:44:10      阅读:113      评论:0      收藏:0      [点我收藏+]

标签:

  今天在练习当中,遇到了一个问题,写一个列表时,

我想实现的效果是这样的

技术分享

但是实现的效果确是这样的

技术分享

太丑了!

写的css是这样子的

li{
   display;inline;
   width:20px;
   height:20px;
   list-style:none;   
}    

对,有的人可能一眼就看出了问题所在,行内元素不能设置宽度和高度的

li{
   width:20px;
   height:20px;
   list-style:none;   
}    

但是这样的结果就是

技术分享宽度和高度正常了,但是li元素立了起来

网上找了好久,解决方案就是

li{
   float:left;
   width:20px;
   height:20px;
   list-style:none;   
}    

就是设置左浮动,

虽然会比较简单,但是新手真的可能会遇到这种问题的

你可能不知道的行内元素和块元素最主要的区别

标签:

原文地址:http://www.cnblogs.com/wr314/p/5516969.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!