css li的宽度

CSS中的li列表元素是前端开发中经常用到的标签之一。其中涉及到的宽度设置也非常关键，下面将介绍一些常见的宽度设置方法。

li{
  width: 100%;
}

首先是将li宽度设置为100%。这种设置方法适用于需要将li元素宽度撑满整个父容器的情况。比如水平导航栏：

<ul>
  <li>Home</li>
  <li>Services</li>
  <li>About</li>
  <li>Contact</li>
</ul>

接下来，我们需要将li元素的宽度设置为均等分。例如我们希望将一个水平导航栏的四个li元素宽度平均分为25%：

ul{
  display: flex;
  justify-content: space-between;
}

li{
  width: 25%;
}

这样设置后，四个li元素的宽度就会均等分成25%。

如果我们希望将li元素的宽度按照内容的长度来进行自适应调整，可以使用以下设置方法：

li{
  display: inline-block;
  width: auto;
}

这种设置方法适用于li元素中包含有长短不一的文字或图片等内容，在不同情况下宽度会有所不同。

综上所述，CSS中对于li元素宽度的设置非常灵活，可以根据实际情况进行选择，实现不同的效果。