What is the CSS border-bottom property?

The border-bottom property in CSS is used to set the properties of the bottom border of a box.

It is a shorthand property of the following:

  • border-bottom-width
  • border-bottom-color
  • border-bottom-style

Syntax

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

Property values

  • border-bottom-color: Sets or defines the color of the bottom border.

  • border-bottom-style: Specifies any style of the bottom border; the default value is none.

  • border-bottom-width: Specifies the width of the bottom border; the default value is medium.

  • initial: Sets the value to its default value.

  • inherit: Inherits property from its parent value.

Example

The example below demonstrates the use of the border-bottom property. We use the border-bottom property to define the border to be nine pixels thick, dotted, and red.