css怎么写代码让ul列表横着显示?请教、谢谢

li { *display: inline; *zoom: 1; } 利用CSS的inline-blick属性,后边两个是针对低版本IE的HACK,注意这个HACK比较特殊,要像我这样独立地写出来 而且,每个li标签之间不能有空格或换行,要像这样写,否则就会造成莫名其妙的外边距,这算是inline-block里面一个不算BUG的BUG吧。。。 内容 内容2...
css怎么写代码让ul列表横着显示?请教、谢谢
li { display: inline-block; }
li { *display: inline; *zoom: 1; }

利用CSS的inline-blick属性,后边两个是针对低版本IE的HACK,注意这个HACK比较特殊,要像我这样独立地写出来

而且,每个li标签之间不能有空格或换行,要像这样写,否则就会造成莫名其妙的外边距,这算是inline-block里面一个不算BUG的BUG吧。。。
<ul><li>
内容
</li><li>
内容2
</li><li>
内容3
</li></ul>

另外,float会带来很多问题,所以不建议用float2012-11-03
假设ul的宽度为1000px;
ul {width:1000px;}
li {width:200px; float:left;}
这样的话就可以使5个li可以横着显示!2012-11-03
mengvlog 阅读 8 次 更新于 2025-07-19 15:59:54 我来答关注问题0
  • 使用CSS编写横向排列的导航栏代码时,可以选用a标签或ul、li标签。如果选择a标签,需注意a标签自带背景显示,需通过CSS属性控制。具体代码如下:a{width:XXpx;height:XXpx;} 代码中的XXpx根据实际需要调整宽度和高度,确保导航栏布局符合设计需求。还需注意清除浮动,避免元素排列错乱。可以使用.clear{}选...

  •  懂视生活 如何让ul实现横向排列不换行的效果

    方案一: 设置足够宽的宽度,然后将li的float属性设置为left。意思就是使li元素向左浮动排列。代码如下:ul { width: 2000px; //设置足够的宽度 overflow: hidden; white-space:nowrap; //处理块元素中的空白符和换行符的,这个属性保证图片不换行}li{ list-style: none; float: left; //向左排...

  •  漠烟aa 如何使ul中li元素横向排列且不换行

    lt;style;.LinkUl { float:left; } lt;/style;lt;div ;lt;h3;lt;b;友情链接lt;/b;lt;/h3;lt;ul id=ul1 class=LinkUl;lt;li;这是第一列的第一个lt;/li;lt;li;这是第一列的第二个lt;/li;lt;li;这是第一列的第三个lt;/li;lt;/ul;lt;ul id=ul2 class=LinkUl;lt;li;...

  •  好学者百科 怎么将ul下的li标签横着排列,要设置那个属性?

    把ul包含的li定义为一个类,在css样式用类选择器设置li的float属性为向左浮动,即为float:left;最好将无序列表前面的点去掉。即ul的list-style-type:none;这样设计出来的比较美观。

  • anonymous css中li设了左浮动,如何使它宽度超过ul以后依然不自动换行,成横排显示?

    设置ul一个固定的宽度,如:width:1000px 设置ul横向超出后自动。overflow-x:auto 设置ul竖向超出隐藏 有足够多的li,li的width设置为100px ,li的数量最少为11个 因为li数量多,导致ul会出现横向滚动条,这样就实现了想要的效果

檬味博客在线解答立即免费咨询

CSS相关话题

Copyright © 2023 WWW.MENGVLOG.COM - 檬味博客
返回顶部