css中ul纵向排列 |css 字符大小为0

.ul-vertical {
display: flex;
flex-direction: column;
list-style: none;
padding: 0;
margin: 0;
}
.ul-vertical li {
padding: 10px;
border: 1px solid #ccc;
}

上面的代码中，首先需要对ul设置display为flex，使得ul变成一个flex容器，然后将flex-direction设置为column，表示让里面的子元素进行垂直排列。此外，还需要将list-style、padding和margin设置为0，去除默认的样式。接着是对li的样式设置，这里给li加上了padding和border，以便更好地显示每个列表项。

使用上述样式，大家可以将一个ul列表纵向排列：

<ul class="ul-vertical"><li>列表项1</li><li>列表项2</li><li>列表项3</li><li>列表项4</li><li>列表项5</li></ul>

效果如下：

• 列表项1
• 列表项2
• 列表项3
• 列表项4
• 列表项5

需要注意的是，使用ul纵向排列时，其父元素的高度会自适应，因此需要在父元素上设置合适的高度，否则可能会出现高度不足以显示全部列表项的情况。