今天我来给大家分享一下CSS如何写出居中菜单。
首先,我们需要了解CSS中有几种居中方式,它们分别是text-align:center、margin:auto和position:absolute+transform。对于水平方向的居中而言,三种方式的效果基本相同,但对于垂直方向的居中就有所不同了。
如果我们要让菜单在水平方向上居中,可以使用以下代码:
.menu {
text-align:center;
} .menu {
position:absolute;
top:50%;
transform:translateY(-50%);
} .menu {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
}