css画叉 x |css设置方式

/* 设置图标宽高和颜色 */
.icon-x {
width: 20px;
height: 20px;
background-color: red;
}
/* 绘制叉 x */
.icon-x:before,
.icon-x:after {
content: "";
position: absolute;
width: 3px;
height: 20px;
background-color: white;
}
.icon-x:before {
transform: rotate(45deg);
}
.icon-x:after {
transform: rotate(-45deg);
}
/* 在 HTML 中使用图标 */

上述代码中，大家创建了一个名为icon-x的类，定义了它的宽度、高度和背景颜色。然后，大家使用:before和:after伪元素来绘制叉 x。大家把叉 x 拆分为两个斜线，通过旋转斜线实现叉 x 的效果。

最后，大家在 HTML 中添加了一个具有icon-x类的div元素，从而在网页中显示红色的叉 x 图标。