css样式hr-代码示例

CSS样式hr是用于在网页中插入水平分隔线的一种方法。通过设置hr元素的样式，我们可以改变分隔线的颜色、宽度、样式等。下面是一些常用的示例代码和解释：

1. 改变分隔线的颜色：

hr {
  background-color: red;
}

上述代码将分隔线的背景颜色设置为红色。

2. 改变分隔线的宽度：

hr {
  border-width: 2px;
}

上述代码将分隔线的边框宽度设置为2像素。

3. 改变分隔线的样式：

hr {
  border-style: dotted;
}

上述代码将分隔线的边框样式设置为点状。

4. 改变分隔线的位置：

hr {
  margin-top: 20px;
}

上述代码将分隔线与上方元素之间的间距设置为20像素。

5. 改变分隔线的长度：

hr {
  width: 50%;
}

上述代码将分隔线的宽度设置为父元素宽度的50%。

通过以上示例代码，我们可以看到如何使用CSS样式hr来改变分隔线的颜色、宽度、样式、位置和长度。根据实际需求，我们可以根据这些示例代码进行修改和扩展，以实现不同的分隔线效果。