CSS border-bottom-style
The CSS border-bottom-style
property allows you to set the style of a bottom border.
You can also use border-style
to set the style for all sides of your element, or border-bottom
to set all border properties for the bottom border.
You can use the border-bottom-color
or border-color
properties to set the color of the border. If you don't set a color, the default will be currentColor
(i.e. whatever the value of the color
property is).
Also, the default width of a border is medium
. You can specify the width using either the border-bottom-width
or border-width
properties.
Syntax
Where
Details on these values below.
Possible Values
none
-
No border. Color and width are ignored. Therefore, the border's width is
0
, and the initial value ofborder-image-width
will also resolve to zero. hidden
dotted
- A series of round dots.
dashed
- A series of square-ended dashes.
solid
- A single line segment.
double
- Two parallel solid lines with some space between them. When using this value, the
border-width
value determines the sum of the lines and the space between them. groove
- Looks as if it were carved in the canvas.
ridge
- Looks as if it were coming out of the canvas.
inset
- Looks as if the content on the inside of the border is sunken into the canvas. Treated as
ridge
in the collapsing border model. outset
- Looks as if the content on the inside of the border is coming out of the canvas. Treated as
groove
in the collapsing border model.
In addition, all CSS properties also accept the following CSS-wide keyword values as the sole component of their property value:
initial
- Represents the value specified as the property's initial value.
inherit
- Represents the computed value of the property on the element's parent.
unset
- This value acts as either
inherit
orinitial
, depending on whether the property is inherited or not. In other words, it sets all properties to their parent value if they are inheritable or to their initial value if not inheritable.
General Information
- Initial Value
none
- Applies To
- All elements.
- Inherited?
- No
- Media
- Visual
- Animatable?
- No
Example Code
Official Specifications
- CSS Backgrounds and Borders Module Level 3 (W3C Candidate Recommendation 9 September 2014)
- CSS Level 2.1 (W3C Recommendation 07 June 2011)