CSS border-top-style (Set/Change the Style of Top Border)

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

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      h2 {border: 8px dotted crimson; border-top-style: solid; padding: 12px;}
      p {border: 6px dashed lightcoral; border-top-style: solid; padding: 12px;}
   </style>
</head>
<body>

   <h2>The border-top-style Property</h2>
   <p>This is a para.</p>
   
</body>
</html>
Output

The border-top-style Property

This is a para.

CSS border-top-style Syntax

The syntax of border-top-style property in CSS, is:

border-top-style: solid|dashed|dotted|double|ridge|groove|inset|outset|initial|inherit|none|hidden;

All the border style values are described in separate tutorial.

CSS Online Test


« Previous Tutorial Next Tutorial »

Follow/Like Us on Facebook




Subscribe Us on YouTube