css怎么设置ul居中

在网页布局中，ul（无序列表）是一个常用的元素，往往我们需要把它居中在页面上。下面我们来看看如何使用CSS设置ul居中。
首先，我们要把ul的左右margin设置为auto。这样就可以让ul在父元素中水平居中了。我们可以这样写CSS代码：

ul {margin: 0 auto;}

以上代码中，0表示上下margin为0，auto表示左右margin为自动，即自动分配左右margin使得ul水平居中。
然而，我们可能会发现如果ul的宽度比较小，它并没有完全居中。这时我们可以给ul设置一个固定宽度，并把它的display属性设置为inline-block。这样就可以保证ul在父元素中完全居中了。我们可以这样写CSS代码：

ul {margin: 0 auto;width: 80%; /* 这里可以根据实际情况来设置宽度 */display: inline-block;}

以上代码中，80%表示ul的宽度为其父元素宽度的80%；display: inline-block表示ul在父元素中以行内块元素的形式显示。
最后，我们需要注意一下ul的父元素的text-align属性。如果ul的父元素是一个块级元素（如div），那么我们需要把它的text-align属性设置为center，以保证ul垂直居中。这样，我们的CSS代码就可以这样写：

.parent {text-align: center;}ul {margin: 0 auto;width: 80%; /* 这里可以根据实际情况来设置宽度 */display: inline-block;}

以上代码中，.parent是ul的父元素，我们给它设置了text-align: center，以保证ul垂直居中。
总之，要居中一个ul，我们只需要把它的左右margin设置为auto，并给它设置一个固定宽度和display: inline-block属性，以及给ul的父元素设置text-align: center属性即可。

上一篇：css怎么设置图片旋转

下一篇：css怎么让狂向下

---