css ul li 边框

CSS中使用ul li标签经常会涉及到边框样式的设置，下面我们来了解一下如何使用CSS来设置ul li的边框样式。

  
    ul {
      list-style: none; /* 去除默认列表样式 */
      padding: 0; /* 去除ul的内边距 */
    }
    li {
      border: 1px solid #ccc; /* 设置li边框 */
      margin-bottom: 10px; /* 设置li之间的距离 */
      padding: 10px; /* 设置li内部的填充 */
    }
  

以上CSS代码将会设置一个有边框的列表，每个li之间相距10px，内部填充10px，边框颜色为#ccc的样式。

我们还可以进一步设置li的hover状态样式，例如：

  
    li:hover {
      background-color: #f5f5f5; /* 鼠标悬浮时的背景颜色 */
    }
  

以上CSS代码将会设置li鼠标悬浮时的背景颜色为#f5f5f5。

在实际开发中，根据需要，我们还可以设置li边框圆角、边框大小、边框样式等属性，来实现不同的边框样式。以上就是CSS设置ul li边框的基本方法。