CSS border-top Property

CSS border-top Property

This property defines in a shorthand form the width, style, and color for the top border of an element.

Syntax -

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

Now we will see value with their descriptions -

border-top-width	border-width sets the width of the top border as a positive numeric measurement or using a named value of thin, medium, or thick, and its default value is medium.
border-top-style	border-style, is used to set the style of the top border and is set to a value of dashed, dotted, double, groove, hidden, inset, none, outset, ridge, or solid, and its default value is "none".
border-top-color	border-color is used to set the color of the top border using a CSS color value, and its default value is color of the text.

Now we will see Example -

Example -

<!DOCTYPE html>
<html>
<style>
.one{
border: 4px solid;
border-top: thick dashed rgb(14, 152, 7);
}
.two{
border: 4px solid;
border-top: thick dotted green;
}
.three{
border: 4px solid;
border-top: thick double green;
}
</style>
<body>
<h1 class="one">This is a heading</h1>
<h1 class="two">This is a heading</h1>
<h1 class="three">This is a heading</h1>

</body>
</html>

Output -