按钮特效 - 斜线条纹（一）

按钮特效 - 斜线条纹（一）

1、效果图（静态效果）

2、代码

background: #3e7e8d; /*背景色*/
/* 倾斜角度 */
/* hsla() 函数使用色相、饱和度、亮度、透明度来定义颜色 */
background-image: repeating-linear-gradient(
  150deg,
  hsla(0, 0%, 100%, 0.1),
  hsla(0, 0%, 100%, 0.1) 5px,
  transparent 0,
  transparent 8px
);

3、知识点
1）重复的线性渐变：CSS repeating-linear-gradient() 函数
2）csshsla()函数