为什么我的导航元素不会转到中心或更改样式？

Question

我试图将我的导航元素设置为中心,但它不适用于旧版本的Internet Explorer或Chrome.它也不会改变风格.我怎样才能让这个中心化并改变？这是代码:

导航:

<nav id="Nav">
    <a href="TMR Library.html">Library</a> |
    <a href="TMR Contact.html">Contact</a> |
    <a href="TMR About.html">About</a>
</nav>

CSS

#Nav {
    margin:0 auto;
    font-size: 40px;
    color: #22b14c;
    font-family: "Papyrus";
}

Answer 1

有许多方法可以集中元素:

保证金方式:

设定宽度或display: inline-block;您可以使用:

margin-left: auto;
margin-right: auto;

text-align 办法:

使用设置的宽度或display: inline-block;您可以将其添加到父级:

text-align: center;

绝对方式:

position: absolute;
left: 50%;
margin-left: width/2;

要么

position: absolute;
left: 50%;
transform: translate(0, -50%);

也不要太担心ie7及以下,因为大多数人使用更高版本的ie或不同的浏览器虽然这应该工作直到ie6

另外需要注意的是,您想要为导航栏使用ul.我知道,根据经验,它可以正常工作,但如果您想要向导航栏添加下拉菜单那么它就更难了.