css ul的display设成inline-block,li为什么没有横向。还有怎么均分li的宽度呢呢
作者&投稿：弋差 （若有异议请与网页底部的电邮联系）
首先学习一下width属性的定义和用法：
定义和用法
width 属性设置元素的宽度。
说明
这个属性定义元素内容区的宽度，在内容区外面可以增加内边距、边框和外边距。
行内非替换元素会忽略这个属性。
可以通过width属性设置li中字段的宽度根据实际长度显示宽度。在li的样式中加上width:auto;就可以实现了；现在来看下面一段代码：
CSS样式设置：
#info_main{text-align:center; border:1px solid #CCC;width:620px;}#info_main li{width:auto;float:left;margin:0px 8px; padding:0px;border:1px solid #CCC;}网页代码：
时间：{dede:field name='pubdate' function='strftime("%Y-%m-%d %H:%M","@me")' /}来源：{dede:field.source/}作者:{dede:field.writer/}点击:次
直接设即可。不信你试下
ul的display设成inline-block又不是li的，li当然不横向了。不过习惯都是用float：left来做。等分情况多多，li有边框还要考虑到两个li靠在一起边框也挤一起，看起来就粗了不好看，又要处理。所以等分看情况吧！你要把inline-block加在li的样式里
比如下面这个例子
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
ul{
width:200px;
padding:0;
margin:0;
border:0;
}
li{
display:inline-block;
list-style:none;
height:25px;
line-height:25px;
text-align:center;
width:30%;
}
</style>
</head>
<body>
<ul>
<li>001</li>
<li>002</li>
<li>003</li>
</ul>
</body>
</html>
给li设置宽度33.3333%
Vue实践-CSS样式position/display/float属性对比使用
贰东尼尔： ul的display设成inline-block又不是li的,li当然不横向了.不过习惯都是用float:left来做.等分情况多多,li有边框还要考虑到两个li靠在一起边框也挤一起,看起来就粗了不好看,又要处理.所以等分看情况吧!
富蕴县13981998799： 刚开始学CSS,这里的ul设置成100%有什么用处..最后的li 设置成inline有什么用?谢谢了~ - ？
贰东尼尔： 其实ul和li都是块状元素,ul不设置为100%,其实也是100%,设置为100%,也就是让你看着更清楚,li设置inline是不让li称为块状,是内涵元素,这样li里的内容有多少,li的宽度就有多少,希望能帮到你!!!!
富蕴县13981998799： css display: inline - block;的效果是做什么? - ？
贰东尼尔： 把一个元素变成块级元素,但他的大小只是他本身的大小不是div那种通栏宽度,我给你画了下图你看看看得明白不
富蕴县13981998799： html css 背景截取不显示图片 - ？
贰东尼尔： ul和li默认是没有宽度和高度的,也就是说,现在l1的大小是0*0,也就是没大小,所以背景图片不能显示.ul和li默认没有width和height,但是有margin,你可以使用background-orign或者background-clip进行设置.或者直接将ul和li的display设置为inline-block(或者block)再设置width和height就行了
富蕴县13981998799： CSS中的display :block 和display :inline ??? - ？
贰东尼尔： 意思是说,在 CSS 定义里面,所有的 块对象 都有一个默认值是:display:block; 即使你不指定,也会默认有这么个属性,(有点类似 h1 的大字号加粗 也是默认属性)后面一句是说的这个属性有什么作用:意思是如果其他非块对象(如 span ...
富蕴县13981998799： display属性的inline和block在什么地方才能用到 - ？
贰东尼尔： 它可以让行内显示为块的元素,变为行内显示,例如<div> DIV1 </div><div> DIV2 </div> 这里DIV1和DIV2分别占一行,但是你给他们加上属性后变了<div style= ＂display:inline ＂> DIV1 </div><div style= ＂display:inline ＂> DIV2 </div> DIV1和...
富蕴县13981998799： CSS里面, 一个ul , 我没有定义它的宽度, 但是我想让这个ul在包含他的DIV 里面居中显示, 怎么办? - ？
贰东尼尔： 简单的方法必须是给UL设置一个宽度,然后margin:0 auto;但如果你非要不给他宽度的话就是给外面的DIV设置position:relative,然后给UL设置position:absolute; left:50%;top:0; margin-left:-x,这里的X是一个值,假如你的UL是一个固定的值如...
富蕴县13981998799： css的问题,div,input的display属性设置为inline,为什么宽度高度依然有效 - ？
贰东尼尔： display设置为inline一般是用来处理宽度问题的.最典型的是多个div横向排列挤占宽度的问题.和高度一般没有关系.如果你想通过display:inline去设置高度,方向错了.你要设置高度.可以通过height:和line-heigh来设置
富蕴县13981998799： 如何理解CSS的display属性 - ？
贰东尼尔： display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有:none block inline inline-block inherit 下面,我将按照顺序将上述几种属性做一个完整的讲解.第一部分:display:none none这个值表示此元素将不被显示.比如,当我们...
富蕴县13981998799： css样式怎样设置 <ul></ul>标签中li内容居中左对齐? - ？
贰东尼尔： 额...你到底是想居中还是左对齐? 居中就直接用text-align:center; 而默认就是左对齐的,顶多是设置text-align:left;如果你想要的效果是内容偏中间一点,那你就在li上加padding-left控制位置
