代码之家  ›  专栏  ›  技术社区  ›  willcodejavaforfood

水平导航栏的CSS相同大小列表项

css
  •  4
  • willcodejavaforfood  · 技术社区  · 17 年前

    尝试学习一点CSS,我想要一个水平导航栏,我正在使用ul和li来构建它。我希望所有的“按钮”都具有相同的宽度,这是否可能仅使用CSS?

    谢谢

    2 回复  |  直到 17 年前
        1
  •  4
  •   bendewey    17 年前

    不太清楚你所说的相同宽度是什么意思。你只是用链接上的像素设置它?你的限制是什么?你知道名单的宽度吗?还是链接宽度?

    <style type="text/css">
        .menu { margin:0px auto; padding:0px; list-style-type:none; }
        .menu li { margin:0px auto; padding:0px; float:left; }
        .menu li a { display:block; width:200px; }
    </style>
    
    
    <ul class="menu">
        <li><a href="#section1">Section1</a></li>
        <li><a href="#section1">Section1</a></li>
        <li><a href="#section1">Section1</a></li>
    </ul>
    
        2
  •  1
  •   Ikke    17 年前

    是的,

    ul li
    {
        display: block;
        float: left;
        width: 100px;
    }
    ul
    {
        padding: 0px;
        list-style-type: none;
    }