Border-top-width

In this chapter we will learn how to use border-top-width property.

CSS border-top-width property is used to set the width of an element's top border.

We have to define border-style property before using border-width just because we need borders before setting its width.

CSS Syntax

border-top-width: medium | thin | thick | length | initial | inherit;

Let's see an example:

<!DOCTYPE html>
<html>
   <head>
       <style>
            p {
                border-style: dotted;
                border-top-width: thick;
              }
        </style>
   </head>
   <body>

      <p>As you can see, we used border-top-width property to set the width of top border of this element.</p>

   </body>
</html>

Here the result is:



Property Values

Value Descriptions
medium It defines medium top border. It is the default value of this property.
thin It defines thin top border.
thick It defines thick top border.
length It is used to set the thickness of the top border.
initial It makes the property use its default value.
inherit It inherits the property from its parents element.