CSS border-top-width Property

Thuộc tính border-top-width trong CSS dùng để đặt độ rộng cho đường viền trên của phần tử. Bạn cần dùng border-top-style hoặc border-style trước khi dùng border-top-width.

Giá trị mặc định: medium

Cú pháp:  

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

Giá trị thuộc tính: Các giá trị của thuộc tính border-top-width được liệt kê dưới đây:  

  • length: Dùng để đặt độ rộng của đường viền. Giá trị này không chấp nhận số âm.
  • thin: Dùng để thiết lập đường viền mỏng ở phía trên của phần tử.
  • medium: Dùng để đặt đường viền trên có kích thước trung bình. Đây là giá trị mặc định.
  • thick: Dùng để đặt đường viền trên dày.
  • initial: Dùng để thiết lập border-top-width về giá trị mặc định ban đầu.
  • inherit: Thuộc tính này được kế thừa từ phần tử cha của nó.

Ví dụ:  Trong bài viết này, chúng ta sẽ sử dụng thuộc tính đã giải thích ở trên.

HTML
<!DOCTYPE html>
<html>
<head>
    <title>
        border-top-width property
    </title>

    <style>
        #thin {
            border-color: green;
            border-top-style: solid;
            border-top-width: thin;
        }

        #medium {
            border-color: green;
            border-top-style: solid;
            border-top-width: medium;
        }

        #thick {
            border-color: green;
            border-top-style: solid;
            border-top-width: thick;
        }

        #length {
            border-color: green;
            border-top-style: solid;
            border-top-width: 20px;
        }

        #initial {
            border-color: green;
            border-top-style: solid;
            border-top-width: initial;
        }
    </style>
</head>

<body style="text-align:center">

    <h1 style="color:green">GeeksforGeeks</h1>

    <h3>border-top-width property</h3>

    <div id="thin">
        border-top-width: thin;
    </div><br><br>

    <div id="medium">
        border-top-width: medium;
    </div><br><br>

    <div id="thick">
        border-top-width: thick;
    </div><br><br>

    <div id="length">
        border-top-width: length;
    </div><br><br>

    <div id="initial">
        border-top-width: initial;
    </div>
</body>
</html>

Đầu ra:  

css-border-top-width-property

Các trình duyệt được hỗ trợ: Các trình duyệt hỗ trợ thuộc tính border-top-width được liệt kê dưới đây:  

  • Google Chrome 1.0 trở lên
  • Edge 12.0 trở lên
  • Internet Explorer 4.0 trở lên
  • Opera 3.5 trở lên
  • Safari 1.0 trở lên
  • Firefox 1.0 trở lên

Last Updated : 21/07/2025