html - 导航下拉菜单未居中

标签 html css navigation alignment center

所以我正在完美地跟随这个视频,该视频展示了如何编写下拉导航,基本上只是想找到最简单和最好看的方式来编写一个。无论如何,在视频中,这些家伙的文字似乎与他的导航对齐,但我的却没有。

视频:https://www.youtube.com/watch?v=PN1iMaVfzfQ

HTML

使用下拉菜单导航

<link href="styles.css" type="text/css" rel="stylesheet"/>

<body>

    <div id="nav">
        <div id="nav-wrapper">
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Contact Us</a></li>
                <li><a href="#">Social</a></li>
            </ul>
        </div>
    </div>

</body>
</html>

CSS

body{
    padding: 0;
    margin: 0;
    overflow-y: scroll;
    font-family: Arial;
    font-size: 18px;
}

#nav {
    background-color: #222;
}

#nav_wrapper {
    width: 960px;
    margin: 0 auto;
    text-align: left;
}

最佳答案

您的下划线应该是 CSS 中的连字符。

#nav_wrapper should be #nav-wrapper.

关于html - 导航下拉菜单未居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20804407/

相关文章:

javascript - 如何在单击而不是悬停时调用工具提示

HTML:一排 &lt;textarea&gt; 的高度是多少?

CSS 网格 : how to make grid cell a hyperlink target?

javascript - 如何从 Uploadcare 小部件中隐藏选择文件按钮

javascript - 修复了 div 上的导航效果

html - float 图像周围具有最小列宽的流动文本

java - 当我启动抽屉导航时应用程序崩溃

ruby-on-rails - Rails Active Record 多态嵌套资源导航

html - 如何设置绝对定位元素的父元素的高度以随子元素增长/缩小

javascript - 我在 native react 中遇到 this.props.navigation.navigate 问题