您可以使用
repeating-linear-gradient执行此操作:
.text {
font-size: 30px;
line-height: 50px;
background-image: repeating-linear-gradient(
blue,
blue 45px,
transparent 45px,
transparent 50px
);
}
前两种颜色将是您的“背景”颜色,它们将覆盖您的文本.
接下来的两种颜色是透明的,它们将以文本的行高结束.
片段:
body {
background: #cfc;
}
.text {
color: #FFFFFF;
width: 300px;
font-size: 30px;
line-height: 50px;
background-image: repeating-linear-gradient(
blue,
blue 45px,
transparent 45px,
transparent 50px
);
}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.