css3 渐变分割线 |css火狐兼容低版本

hr{
height: 10px; /* 分割线的高度 */
margin: 30px 0; /* 分割线的外边距 */
border: none; /* 去掉默认的边框 */
background: linear-gradient(to right, rgba(0,0,0,0), #ccc, rgba(0,0,0,0)); /* CSS3 渐变 */
}

上述代码中，大家使用了CSS3中的linear-gradient属性，指定了一个从左到右的渐变。渐变的颜色值使用了rgba()函数，第四个参数是透明度值。通过设置透明度值，大家可以使得分割线两侧的颜色逐渐淡化。

需要注意的是，linear-gradient属性是一个比较复杂的属性，需要设置多个参数。其中，to right表示渐变方向从左向右，rgba(0,0,0,0)表示分割线两侧的颜色值均为黑色，但是透明度为0，因此不可见，#ccc表示分割线的中间部分颜色为灰色。

通过上述代码，大家可以得到一条宽度为100%的分割线，颜色由黑色逐渐过渡到灰色，再逐渐回到黑色，非常美观。

当然，linear-gradient属性还可以设置其他方向的渐变效果，例如from left to right、from top to bottom等，大家可以根据自己的需求进行设置。