淘先锋技术网

首页 1 2 3 4 5 6 7

CSS分割线属性可以用于为网页中的不同部分添加分隔符,让页面更美观,更易于阅读。下面介绍几种常见的CSS分割线属性。

/* 添加水平分割线 */
hr {
border: none;
border-top: 1px solid #eee; /* 可以自定义颜色和宽度 */
clear: both; /* 清除浮动 */
margin: 20px 0; /* 可以自定义上下边距 */
}
/* 添加垂直分割线 */
.divider {
height: 30px; /* 可以自定义高度 */
width: 1px;
background-color: #ccc; /* 可以自定义颜色 */
display: inline-block;
margin: 0 10px; /* 可以自定义左右边距 */
}
/* 添加虚线分割线 */
.dashed {
border: none;
border-top: 1px dashed #ddd; /* 可以自定义颜色和宽度 */
clear: both; /* 清除浮动 */
margin: 20px 0; /* 可以自定义上下边距 */
}
/* 添加渐变分割线 */
.linear-gradient {
border: none;
height: 10px; /* 可以自定义高度 */
background: linear-gradient(to right, rgba(255, 255, 255, 0), #ccc, rgba(255, 255, 255, 0));
/* 可以自定义渐变方向、颜色和透明度 */
clear: both; /* 清除浮动 */
margin: 20px 0; /* 可以自定义上下边距 */
}

以上是一些常见的CSS分割线属性,使用它们可以使页面更加美观,提高用户的阅读体验。