css 描边

/* 使用 CSS 实现文本描边效果 */

.text-stroke {
  /* 设置字体颜色为透明 */
  color: transparent;
  /* 使用 text-shadow 实现描边效果 */
  text-shadow: 
    1px 1px 0 #000,   /* 右下角描边 */
    -1px -1px 0 #000, /* 左上角描边 */
    1px -1px 0 #000,  /* 右上角描边 */
    -1px 1px 0 #000,  /* 左下角描边 */
    2px 0px 0 #000,   /* 右侧描边 */
    -2px 0px 0 #000,  /* 左侧描边 */
    0px 2px 0 #000,   /* 下方描边 */
    0px -2px 0 #000;  /* 上方描边 */
}

/* 或者使用更简单的 webkit 内核浏览器支持的属性 */
.text-stroke-webkit {
  /* 设置字体颜色 */
  color: white;
  /* 使用 -webkit-text-stroke 实现描边 */
  -webkit-text-stroke: 2px black;
}

解释说明：

1. text-shadow 方法：通过叠加多个 text-shadow 来模拟描边效果。每个 text-shadow 定义了一个方向和颜色，组合起来形成一个均匀的描边效果。

2. -webkit-text-stroke 方法：这是 WebKit 浏览器（如 Chrome、Safari）特有的属性，可以直接设置描边的宽度和颜色，更加简洁。

你可以根据浏览器的支持情况选择合适的方式。