border-radius属性为序号添加圆角边框

border-radius属性可以用来为元素的边框添加圆角效果。可以为每个角指定一个半径值，也可以为每个角分别指定不同的半径值，从而实现各种圆角效果。

以下是一个示例，将一个序号添加圆角边框：

HTML代码：

<ul>
  <li class="border-radius">1</li>
  <li class="border-radius">2</li>
  <li class="border-radius">3</li>
  <li class="border-radius">4</li>
</ul>

CSS代码：

.border-radius {
  display: inline-block;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  margin: 10px;
  border-radius: 50%;
  border: 2px solid #ccc;
}

在上面的代码中，我们为li元素添加了一个名为border-radius的类，然后通过CSS代码为这个类添加了圆角边框的样式。具体来说，我们设置了宽度、高度、文本对齐方式、行高和边距等样式，然后使用border-radius属性将边框的四个角都设置为50%的半径，从而实现了圆形的效果。同时，我们还设置了一个2px的灰色实线边框，使得序号看起来更加清晰。