📌  相关文章
📜  CSS | border-bottom-color 属性(1)

📅  最后修改于: 2023-12-03 15:14:19.357000             🧑  作者: Mango

CSS | border-bottom-color 属性

简介

CSS 的 border-bottom-color 属性设置 HTML 元素底部边框的颜色。

语法
border-bottom-color: color|transparent|initial|inherit;

  • color：可以是红色、十六进制值等等...

  • transparent：底部边框为透明。

  • initial：设置为默认值。

  • inherit：从其父元素继承底部边框颜色。

示例
代码
<!DOCTYPE html>
<html>
<head>
	<title>border-bottom-color 示例</title>
	<style>
		h1 {
			border-bottom-style: solid;
			border-bottom-width: 5px;
			border-bottom-color: #F67088;
		}
	</style>
</head>
<body>
	<h1>这是一个标题</h1>
	<p>这是一个段落。</p>
</body>
</html>
效果

border-bottom-color 示例

注意事项

  • border-bottom-color 必须与 border-bottom-style 和 border-bottom-width 一起使用才能生效。

  • 建议使用缩写属性 border-bottom 代替分别设置 border-bottom-style、border-bottom-width 和 border-bottom-color。

总结

通过使用 border-bottom-color 属性，我们可以在样式中控制 HTML 元素底部边框的颜色，使网页排版更加美观。