Thuộc tính chiều rộng đường viền CSS được sử dụng để chỉ định chiều rộng cho đường viền của một phần tử. Chúng tôi cũng có thể đặt chiều rộng cho các cạnh riêng lẻ bằng cách sử dụng các thuộc tính border-top-width, border-right-width, border-left-width và border-right-width.
Cú pháp
Cú pháp của thuộc tính chiều rộng đường viền CSS như sau−
Selector {
border-width: /*value*/
} Ví dụ
Các ví dụ sau minh họa thuộc tính CSS border-width -
<!DOCTYPE html>
<html>
<head>
<style>
#main {
border-bottom-width: 20px;
border-bottom-left-radius: 40px;
border-bottom-right-radius: 40px;
}
div {
margin: auto;
height: 100px;
width: 80px;
border-style: double;
border-width: 5px;
}
div > div {
margin-top: 15px;
height: 50px;
width: 50px;
border-style: dashed;
border-color: red;
border-width: thin;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>
<div id="main">
<div>demo</div>
</div>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
p {
padding: 2%;
border-style: ridge;
border-width: 4px;
border-color: indianred;
}
q {
border-style: solid;
border-width: thin;
text-align: center;
font-style: italic;
}
</style>
</head>
<body>
<p>
Student details are covered here.
</p>
<hr>
<q>Education is the most powerful weapon which you can use to change the world.</q>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
