牛大der 2021-12-07 10:09 采纳率: 50%
浏览 65
已结题

为什么li标签会掉下来,我把li中的数字12删掉就恢复正常了,



```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    li{
        list-style:none;
        width: 40px;
        height: 40px;
        border: 1px solid #000;
        border-radius: 50%;
        display: inline-block;
        line-height: 40px;
        text-align: center;
    }
    ul{
        display: inline-block;
    }
</style>
<body>
<div>
    <ul>
        <li>12</li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <ul>
        <li></li>
        <li></li>
    </ul>
</div>
</body>
</html>


img

<body>
<div>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <ul>
        <li></li>
        <li></li>
    </ul>
</div>
</body>

img

  • 写回答

4条回答 默认 最新

  • 前端阿彬 前端领域新星创作者 2021-12-07 10:51
    关注

    li设置 vertical-align: top;
    vertical-align用来指定行内元素或表格元素的垂直对齐方式
    因为你里面有文字之后,文字的默认垂直对齐方式是baseline,也就是圆的底部,也就把圆拖了下来,如果你设置成顶部之后,他就会上去,又因为文字有line-height,虽然文字基线在圆顶部,但文字还是垂直居中效果。

    如有帮助,望采纳 ^.^ 谢谢啦

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 12月15日
  • 已采纳回答 12月7日
  • 修改了问题 12月7日
  • 创建了问题 12月7日

悬赏问题

  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么
  • ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
  • ¥16 mybatis的代理对象无法通过@Autowired装填
  • ¥15 可见光定位matlab仿真
  • ¥15 arduino 四自由度机械臂
  • ¥15 wordpress 产品图片 GIF 没法显示
  • ¥15 求三国群英传pl国战时间的修改方法
  • ¥15 matlab代码代写,需写出详细代码,代价私
  • ¥15 ROS系统搭建请教(跨境电商用途)