CSS border-bottom 属性

CSS border-bottom 属性定义一个元素的底部边框样式、宽度和颜色。

语法

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

其中，

• border-width 定义边框宽度，可以是数值、thin、medium、thick 或者由 4 个值构成的空格分隔的数字列表。
• border-style 定义边框样式，可以是 none、hidden、dotted、dashed、solid、double、groove、ridge、inset 或者 outset。
• border-color 定义边框颜色，可以是颜色名、HEX 值、RGB 值、HSL 值或者由 4 个值构成的空格分隔的颜色列表。

实例

设置所有边框

/* 设置所有边框的宽度为 2px，样式为实线，颜色为 #ff0000（红色）*/
border: 2px solid #ff0000;

设置底部边框

/* 只设置底部边框宽度为 2px，样式为实线，颜色为 #ff0000（红色）*/
border-bottom: 2px solid #ff0000;

设置虚线底边

/* 设置底部边框宽度为 1px，样式为虚线，颜色为 #000000（黑色）*/
border-bottom: 1px dashed #000000;

设置多个边框

/* 设置顶部和左侧边框宽度为 2px，样式为实线，颜色为 #ff0000（红色）；设置底部和右侧边框宽度为 1px，样式为虚线，颜色为 #000000（黑色）*/
border-width: 2px 1px;
border-style: solid dashed;
border-color: #ff0000 #000000;

以上实例只是 CSS border-bottom 属性的基本用法，更多用法请参见 CSS 边框。