https://www.w3cschool.cn/css_secrets/
CSS 有很多不常用,但高大上的属性。
分享一段开发中使用的代码,绘制条纹背景。
绘制直线旋转可能出现锯齿。
测试了用宽度为根号2时效果不错。
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.line {
width: 500px;
height: 50px;
background: repeating-linear-gradient(135deg, rgba(0,0,0,0), rgba(0,0,0,0) 0.70710678px, rgb(0,100,210) 0.70710678px, rgb(0,100,210) 2.12132034px, rgba(0,0,0,0) 2.12132034px, rgba(0,0,0,0) 2.82842712px );
}
</style>
</head>
<body>
<div class="line">
</div>
</body>
</html>