css中怎样添加十字架框

CSS中我们可以使用伪元素 ::before 和 ::after 来创建十字架框，下面是一个例子：

.box {
  position: relative;
  height: 300px;
  width: 500px;
  background-color: #fff;
}

.box::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  border-top: 1px solid #000;
}

.box::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  border-left: 1px solid #000;
} 

首先我们创建一个包裹元素，设置它的 position 为 relative，然后我们使用 ::before 伪元素在包裹元素中间创建一个横线，设为绝对定位，top 为 50%，left 和 right 都为 0，border-top 设为 1px，并设置颜色为黑色。

接着我们使用 ::after 伪元素在包裹元素左边创建一个竖线，设为绝对定位，top 和 bottom 都为 0，left 为 50%，border-left 设为 1px，并设置颜色为黑色。

这样我们就完成了一个简单的十字架框，调整包裹元素的尺寸和背景色就可以适用于不同的场景。