图片花纹背景:

linear-gradient()
param1:渐变角度,deg,to bottom等描述
param2:颜色 + 百分比、像素值等,渐变第一个颜色和颜色渐变范围
param3:渐变后面的颜色和范围

实现
1
2
3
4
5
6
background-color: #ccc;
background-size: 16px 16px;
background-image:
linear-gradient(45deg,rgba(0,0,0,.5) 25%,transparent 0,transparent 75%,rgba(0,0,0,.5) 0),
linear-gradient(45deg,rgba(0,0,0,.5) 25%,transparent 0,transparent 75%,rgba(0,0,0,.5) 0);
background-position: 0 0,8px 8px;
css文本属性利用

图片标签特别多,右边空间浪费,利用float不会和文本重合,让尺寸float:right,并且通过margin留出区别空间,标签文字排布时会自然在margin以外包围尺寸。