开发者社区> 问答> 正文

li文字居中问题

screenshot

如上图所示,想让li标签中的文字始终位于中间,一行字数不超过3个,超过就自动换行。应该怎么实现呢

展开
收起
杨冬芳 2016-06-06 15:16:09 2139 0
1 条回答
写回答
取消 提交回答
  • IT从业

    这不就是多行垂直居中的问题嘛。来看看这篇文章:css多行垂直居中(兼容ie6) ,另外根据你这个,需要限制一下内容的宽度和加上margin:0 auto;

    补充:刚又仔细看了一下,发现你这个有两个字居中和三个字居中的,然后我发现无解。。。
    唯一办法是使用js.
    判断li的总文字个数,当字数小于或等于4时,给li加一个标签为li2. 当字数为大于4时,给li加标签为li3.当li小于或等于3时,给li加li1.

    li2{width:32px; height:44px; line-height:22px;}/*一行2个字,两行*/
    li3{width:48px; height:44px; line-height:22px;}/*一行3个字,两行*/
    li1{width:16px; height:22px; line-height:22px;}/*一行*/

    仅作参考。
    或者你可以自定义内容,那就直接用br.再配合一下标签。

    2019-07-17 19:28:43
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载