CSS border-bottom Property

Description

The border-bottom property is a shorthand that sets the values of border-bottom-color, border-bottom-style, and border-bottom-width. These properties describe the bottom border of elements.

Initial value

See individual properties

Applies to

All elements

Inherited

No

Media

Visual

Computed value

See individual properties

Animatable

Yes

CSS Version

CSS1, CSS2, CSS3

JavaScript syntax

object.style.borderBottom

Syntax

border-bottom: <line-width> || <line-style> || <color>

Values

• <line-width>See border-bottom-width CSS property for values.
• <line-style>See border-bottom-style CSS property for values.
• <color>See border-bottom-color CSS property for values.
• inherit

Example

<div class="border">This is an example of the border-bottom property using a blue solid border 3px in width.</div>

.border {
   border: 1px solid #800000;
   border-bottom: 3px solid #6699FF;
   margin: 20px;
   padding: 20px;
}

Give it a Try

Click the button below to experiment with this property.

Give it a Try!

Browser Support

Desktop
4	12	1	1	3.5	1
Tablets / Mobile
1	18	4	14	1	1.0

Last updated by CSSPortal on: 12th October 2019