Borderbottomstyle

Border-bottom-style is a CSS property used to define the visual style of the bottom border of an element. It is part of the border-style family, which also covers the top, left, and right borders, and can be used on its own or paired with other border properties.

Accepted values are none, hidden, dotted, dashed, solid, double, groove, ridge, inset, and outset. None removes the bottom border, while hidden behaves like none in many contexts to prevent gaps in table rendering. The remaining values create various line patterns for the bottom edge.

Usage and effects: border-bottom-style: solid; applies only to the bottom border. To see the border, the bottom border must have a nonzero width and a color (set with border-bottom-width and border-bottom-color). This property does not affect other sides unless their corresponding border properties are changed. The bottom border style works in conjunction with border-bottom-width and border-bottom-color to produce a visible edge.

Notes: border-bottom-style is not inherited by default, but it can be inherited if explicitly specified. It can be combined with the other bottom-border properties, and the shorthand border-bottom can set width, style, and color for the bottom border in a single declaration.

DOM and compatibility: The property is supported by all major browsers. In the DOM or JavaScript, it is accessed as element.style.borderBottomStyle. The property provides design control while preserving the element’s box model and layout.