为什么文字老是对不齐

img


文字对不齐
这是我的css

img

img

img

你自己把所有的 li 向下移动了，当然不会在 ul 里居中了

你的menu总高度是70，里面的li高度是35，还设置了上边距30，那么li的中心就在高度47.5的地方（30+35/2）然后a标签又有高度，就顶下去了

img

望采纳 ^.^ 谢谢

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <style type="text/css">
        menu{
            width: 100%;
            height: 70px;
            background: #f6f6f6;
        }
        menu>ul{
            width:100%;
            height: 100%;
            list-style-type: none;
        }
        menu>ul>li{
            width: 150px;
            height: 100%;
            text-align: center;
            background: antiquewhite;
            float: left;
            margin-left: 2px;
        }
        menu>ul>li>a{
            width: 100%;
            display: inline-block;
            line-height: 70px;
            font-weight: bold;
            font-size: 20px;
            letter-spacing: 1em;
            color: #333;
        }
    </style>
    <body>
        <menu>
           <ul>
               <li><a href=”./首页.html"></a>首页</1i>
               <li><a href="./html/辣条.html"></a>辣条</1i>
               <li><a href=”./html/暑片.html”></a>片</1i>
               <li><a href=”./html/饮料.html"></a>饮料</1i>
               <li><a href="./html/面包.html"></a>面包</1i>
               <li><a href=”./htm1/水果.htmi"></a>水果</1i>
           </u1>
        </menu>
    </body>
</html>

建议学习 Flex布局方式 方法比较简单，比css或css3编写布局方便 可参考学习网址 https://www.runoob.com/w3cnote/flex-grammar.html

img