请选择 进入手机版 | 继续访问电脑版

宝葫芦源码

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 95|回复: 0

DIV里面的li 水平居中代码分享

[复制链接]

99

主题

100

帖子

605

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
605
发表于 2022-9-15 20:29:59 | 显示全部楼层 |阅读模式
网站制作中,我们在制作导航的时候,经常会遇到 多个并排LI需要页面居中显示,效果入下图
QQ截图20220915202623.jpg
这个时候text-align:center是无效的
下面列数实际可以用的代码:
  1. <style>
  2. .box
  3. {
  4.     width:90%;
  5.     margin:auto;
  6. }
  7. .box ul
  8. {
  9.     display:table;  /**不要设置宽度*/
  10.     margin:10px auto;
  11. }
  12. .box ul li
  13. {
  14.     border:1px solid #06C;
  15.     text-align:center;
  16.     float:left;
  17.     *float:none;
  18.     *display:inline;
  19.     *zoom:1; list-style: none;
  20.         padding:10px;
  21.         margin:10px;
  22.         width:10%;
  23.         background:#06C;
  24. }
  25. .box ul li a{ color:#fff}
  26. </style>
复制代码
以上就是宝葫芦整理的div中li水平居中代码,拿去不谢!!!!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|宝葫芦源码 ( 苏ICP备16043844号-1 )

GMT+8, 2022-10-2 04:23 , Processed in 0.111788 second(s), 23 queries .

Powered by 宝葫芦源码 X3.4

Copyright © 2001-2021, 宝葫芦源码.

快速回复 返回顶部 返回列表