hr 水平线样式
hr.style-one {/*内嵌水平线*/ width:80%; margin:0 auto; border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3); } hr.style-two {/*透明渐变水平线*/ width:80%; margin:0 auto; border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); } hr.style-three{/*渐变*/ width:80%; margin:0 auto; border: 0; height: 1px; background: #333; background-image: linear-gradient(to right, #ccc, #333, #ccc); }