CSS border-bottom 属性

1. 概述

CSS 属性 border-bottom 用于设置元素底部边框的样式、宽度和颜色。

2. 语法

border-bottom: border-width border-style border-color;

• border-width：指定边框宽度，可以设置为长度值（如px、em）或预定义值（thin、medium、thick）。
• border-style：指定边框样式，可以设置为 solid、dashed、dotted、double 等。
• border-color：指定边框颜色，可以设置为颜色值（如#000、rgb(255, 0, 0)）或预定义颜色名。

3. 示例

.border-example {
  border-bottom: 2px solid #333;
}

4. 值

border-width

• thin：细边框，大约等于1px。
• medium：中等边框，大约等于3px。
• thick：粗边框，大约等于5px。
• 长度值：指定具体的边框宽度，如1px、2px。

border-style

• none：无边框。
• hidden：隐藏边框。
• dotted：点状边框。
• dashed：虚线边框。
• solid：实线边框。
• double：双线边框。
• groove：凹槽边框。
• ridge：凸槽边框。
• inset：内嵌边框。
• outset：外凸边框。

border-color

• 颜色值：指定具体的边框颜色，如#333、rgb(0, 0, 255)。
• 预定义颜色名：如 black、red、blue。

5. 注意事项

• 如果只想设置底部边框，可以使用 border-bottom 直接设置，也可以使用 border 设置所有边框，再使用 border-bottom-width、border-bottom-style、border-bottom-color 分别设置底部边框的宽度、样式和颜色。
• border-bottom 可以与其他 border-* 属性组合使用，如 border-bottom-left-radius、border-bottom-right-radius。

以上就是关于 CSS 属性 border-bottom 的详细介绍。