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:
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