Jobs Hub

CSS border-bottom-style (Set/Change Style of Bottom Border)

The CSS border-bottom-style property is used when we need to set the style of bottom border of an element. For example:

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      p.one {border-bottom-style: solid;}
      p.two {border-bottom-style: double;}
      p.three {border-bottom-style: groove;}
      p.four {border-bottom-style: dotted;}
   </style>
</head>
<body>

   <p class="one">This is para one.</p>
   <p class="two">This is para two.</p>
   <p class="three">This is para three.</p>
   <p class="four">This is para four.</p>

</body>
</html>
Output

This is para one.

This is para two.

This is para three.

This is para four.

CSS border-bottom-style Syntax

The syntax of border-bottom-style in CSS, is:

border-bottom-style: value;

Note - All values that can be used to define the style of bottom border, are described in separate tutorial.

CSS Online Test

« Previous Tutorial Next Tutorial »