HTML - 图片不会在页面上水平居中

Question

我有一个图像作为导航栏，我希望它位于页面的中心。它有一个固定的位置，可能会使其无法居中。

HTML 和 CSS:

.navbar {
    display: block;
    position: fixed;
    top: 0;
    text-align: center;
}

<img src="Images/NavBar.png" alt="" class="navbar" usemap="#navbar-map" />

我试过居中标签、text-align: center 和 left: auto;右:自动。没有工作。出了什么问题？

Answer 1

固定位置试试这个。

left:50%;
top:50%;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);