CSS Border Width
The border-width property sets how thick a border is, using a length value or one of the keyword sizes.
Setting the thickness
The <border-width> property controls how thick the border line is. You can give it a precise length such as 2px, or use the keywords thin, medium, and thick when an exact value does not matter.
A three-pixel border
<!DOCTYPE html>
<html>
<head>
<style>
div {
border-style: solid;
border-width: 3px;
}
</style>
</head>
<body>
<div>Bordered box</div>
</body>
</html>Note: Width has no effect on its own. Without a border-style, the border stays invisible no matter how thick you make it.
Per-side widths
Like other border properties, width accepts one to four values. Four values apply to the top, right, bottom, and left in clockwise order, letting you thicken just one edge.
A thick left edge
<!DOCTYPE html>
<html>
<head>
<style>
.quote {
border-style: solid;
border-width: 0 0 0 4px;
border-color: #00643c;
}
</style>
</head>
<body>
<p class="quote">A memorable quote.</p>
</body>
</html>- Use px for a predictable, fixed thickness
- One value sets all four sides equally
- Set a side to 0 to remove its border
