www.1862.net > Css中Li的横向排列自适应宽度的问题

Css中Li的横向排列自适应宽度的问题

当父元素和子元素都没有定义宽度的情况下实现水平居中: display:inline-block 可以使用text-align:center和display:inline-block相结合,这个技巧需要一个父元素。 1、HTML代码: 代码如下: Home … 2、CSS代码: 代码如下: .navbar { text-align:...

试试: li{ float:left; margin:18px;} 例: li{ float:left; margin:18px;} Helo WorldHelo WorldHelo WorldHelo WorldHelo WorldHelo World大家好,大家好,好好好Helo WorldHelo World 大家好,大家好,好好好Helo WorldHelo World

将li的样式设置成以下例子: display:inline;line-height:24px;height:auto;word-break:break-all;word-wrap : break-word ; 可以修改一下,到适合你的要求。

.box{width:500px;height:500px;overflow:hidden;}li{width:100px;height:300px;float:left;background:green;margin:10px;}ul{width:999999px;}

将display:inline 改成 display:inline-block 就大功告成了。将一行的li元素视作类似div的盒子,这样width就能生效了。而不是对文字的属性才有效果

代码我理过了,写的太想当然了,导致繁杂。 你的问题解决方法也很简单,要求换行就直接给换行命令就好了: (ps:要突出种类并换行,直接用换行指令就行了,li里面再套一个ul完全就是自找麻烦,最简单分两+组合都比这样写来的实在。)

.mage_box{ list-style:none; width:1000px; margin:0px auto;} .mage_box li{ width:230px; height:200px; background-color:#ccc; float:left; margin:0px 20px 10px 0px;} 楼主看下是不是这样的效果,把对应的宽度值换成你要的宽度就可以了

使用超出隐藏即可…或者用程序设置字符最大宽度 比如20个汉字40个字节 程序的我不会 但用纯css你可以设置固定宽度和高度然后设置overflow:hidden; ul为什么要大于外部宽度?搞不懂……

改成就好了 你就设置100PX宽他当然浮动不上去。而且你还设置了多余部分隐藏

这样吧,用浮动: ul.menu { display: inline; float: right; margin: 100px 0 0 0; padding: 0 20px 0 0; *zoom: 1; } ul.menu:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; display: none; overflow: ...

网站地图

All rights reserved Powered by www.1862.net

copyright ©right 2010-2021。
www.1862.net内容来自网络,如有侵犯请联系客服。zhit325@qq.com