(伪随机背景)
随机的背景比有规则的背景看起来更加自然，然而如何去制作随机背景呢。
首先做一个四色条纹
div{
width:200px;
height:100px;
background-image:linear-gradient(90deg,#fb3 15%,#655 0,#655 40%,#ab4 0,#ab4 65%,hsl(20,40%,90%) 0);
background-size:80px 100%;
}
这是一个重复的条纹，每80px重复一次，那我们怎么改变会更加好看呢
1.png
方法一
通过几天多数量条纹，然后不同条纹重复的单位尺寸不相同，制造一种假象的随机条纹。
关于条纹的覆盖问题：写在最前面的条纹优先显示，写在越后面的条纹越有可能被前面的条纹覆盖
div{
width:200px;
height:100px;
background:hsl(20,40%,90%);
background-image:linear-gradient(90deg,#fb3 10px,transparent 0),linear-gradient(90deg,#ab4 20px,transparent 0),linear-gradient(90deg,#655 20px,transparent 0);
background-size:80px 100%,60px 100%,40px 100%;
}
这图看起来随机，但其实当width足够大时，他还是重复的，240px为一段，因为80px 60px 40px 最小公倍数为240px。所以到240px 时还是会重复。
2.png
如何去实现最小化的重复呢，只要我们将最小公倍数为足够大时，重复度就会很低，比如把3个宽度设置为41 61 81 ，只要41*61无法整出 81，则他们的最小公倍数就会变的很大，我们的背景条纹就很难重复。
相当于创建了一个伪随机背景
