Skip to content
Related Articles

Related Articles

CSS border-bottom Property
  • Last Updated : 07 Aug, 2019

The border-bottom property in CSS is used to set all bottom border properties in one line. It is used to set the width, style, and color of the bottom border.

Syntax:

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

border-bottom is a shorthand to set the below property values.
Property Values:

  • border-width: It is used to set the width of border.

  • border-style: It is used to set the style of border. Its default value is ‘none’.



  • border-color: It is used to set the color of border.

  • initial:This property is used to set border-bottom to its default value.

  • inherit: This property is inherited from its parent.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>border-bottom property</title>
  
    <!-- border-bottom CSS property -->
    <style>
        h1 {
            border-bottom: 5px solid green;
        }
          
        h2 {
            border-bottom: 4px dotted black;
        }
    </style>
</head>
  
<body style="text-align:center">
  
    <h1>GeeksforGeeks</h1>
    <h2>border-bottom property</h2>
</body>
  
</html>              

chevron_right


Output:

Supported Browsers: The browser supported by border-bottom property are listed below:

  • Google Chrome 1.0
  • Internet Explorer 4.0
  • Firefox 1.0
  • Opera 1.0
  • Safari 3.5
My Personal Notes arrow_drop_up
Recommended Articles
Page :