css如何给div添加一个条纹背景，在背景上画一条有宽度的斜线

在CSS中，可以使用线性渐变（linear-gradient）来创建一个条纹背景，并使用 background 属性的特性来画一条有宽度的斜线。以下是一个示例代码：

/* 创建一个具有条纹背景的div */
.striped-background {
  background: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%), #f0f0f0;
  background-size: 100px 100px; /* 调整这个值来改变条纹的宽度 */
}
 
/* 在条纹背景上画一条有宽度的斜线 */
.striped-background::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to right, transparent 50%, #ff0000 50%); /* 红色斜线 */
  mix-blend-mode: multiply; /* 使斜线与条纹相互影响 */
}

在HTML中使用这个类：

<div class="striped-background"></div>

这段代码会创建一个具有条纹的背景，并且在背景上绘制一条红色的斜线。你可以通过调整 background-size 属性的值来改变条纹的宽度，从而影响斜线的粗细。