Little Web Hut

CSS 2.1 Reference: border-bottom-style Property

CSS border-bottom-style Property
Syntax
selector {border-bottom-style: style;}
  • style is specified by using one of the following keywords: none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset, or inherit.
Usage

The border-bottom-style property is used to specify the style of the bottom border. See the Box Model for a description of the boxes that are generated for elements and the relative position of the borders.

This property is specified by using a keyword according to the syntax shown above.


CSS Example: The border-bottom-style property is set to use a dashed line.
h1 {border: medium solid red;
    border-bottom-style: dashed;
}
Test It HTML StyleTest It XHTML StyleTest It HTML5 Style

Keywords
  • none - No border.
  • hidden - The same as the keyword none. It is however different for table elements in terms of border conflict resolution.
  • dotted - This is a sample
  • dashed - This is a sample
  • solid - This is a sample
  • double - This is a sample
  • groove - This is a sample
  • ridge - This is a sample
  • inset - This is a sample
  • outset - This is a sample
  • inherit - The inherit keyword is used to specify that the value for this property should be taken from the parent element. If inherit is used with the root element, then the initial value for this property will be used.

Note: The border samples, shown above, may not appear identically in all browsers.

Applies To All elements
Inherited No
Initial Value none


border-bottom-style Property Examples
Test It HTML StyleTest It HTML StyleTest It HTML5 StyleThe border-bottom-style property is set to use a dashed line.