CSS border-top Property

The CSS border-top property is a shorthand property for:

border-top-width

border-top-style

border-top-color

Note: If you do not specify the border-top-color, the color applied will be the color of the text.

Syntax:

border-top: border-width border-style border-color;

border-top-width - defines the width of the top border.

border-top-style - defines the style of the top border.

border-top-color - defines the color of the top border.

Example:

<!DOCTYPE html> <html> <head> <style> h4 {   border-top: 5px dotted red; }  p {   border-top: 4px dashed blue; }  div {   border-top: solid; } </style> </head> <body>  <h4>A heading with a dotted red top border.</h4>    <p>A paragraph with a dashed blue top border.</p> <div>A div element with a solid top border.</div>  </body> </html>

Output:

A heading with a dotted red top border.

A paragraph with a dashed blue top border.

A div element with a solid top border.

Enjoy coding!

Read also:

CSS border Property

CSS border-bottom Property