欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

你可能不知道的行内元素和块元素最主要的区别_html/css_WEB-ITnose

程序员文章站 2022-04-18 21:35:22
...
今天在练习当中,遇到了一个问题,写一个列表时,

我想实现的效果是这样的

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

太丑了!

写的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;   }    

就是设置左浮动,

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