如何实现li居中并且内部不换行效果？(li长度不固定)_html/css_WEB-ITnose

我现在是用的li标签和设定li的display:inline;来实现的，可现在如果li的长度过长的话，会在内部到第二行时换行，请问如何实现？注：1.我这是后台读取数据动态生成的，即li的个数不固定，并且每个li的长度不固定
2.要求每行整体居中，并且li不内部换行
3.不知道是网络不给力还是csdn程序问题，图片就是上传不上去

回复讨论(解决方案)

没太清楚。。贴代码出来看看呢?

1、li内部不换行的话存在一个问题，如果你的数据量大于你当前的li的最大的宽度的时候是折行还是不显示呢？
2、你说的全部居中的话就是不存在折行的问题，可以对数据预先处理，截取相应的长度。

设置nowrap则不会换行。

li {    display: inline;    white-space: nowrap;} 

不换行的css 加在ul里面 然后你试试

#ul {white-space:nowrap; width:920px; overflow:hidden;text-overflow:ellipsis;}#li {*float:left; width:90px; margin:0 5px; *clear:right; text-align:center; display:inline-block} 

大家注意了，我的ul是随着div容器宽度自动适应的，下面贴出我的代码，外部div的宽度是动态的，随着页面变化而变化，要的效果就是标签居中，li内部不换行，但是li如果这一行宽度不够自己要能跑到下一行的

    .bNav{    background-color: #3CA9FE;    text-align: center;    line-height: 30px;    font-size: 14px;    margin-top: 5px;width:100%;}    .bNav ul    {        padding: 0;        width:100%;margin: 0 auto;    }        .bNav ul li        {            display:inline;            padding: 0;            margin-right: 15px;margin-left: 10px;                    }                 
  局数据中心建设  数据采集安装    生产指挥  采油工程决策  鲁明采油工程综合业务平台  局采油工程综合业务推广专题  鲁明公司GIS系统  局动态监测  电子地宫

      
查看更多关于如何实现li居中并且内部不换行效果？(li长度不固定)_html/css_WEB-ITnose的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did105802