CSS - Border

About

Border of a box

Properties

Dimension and color

Shorthand

h1 {
   border: 1px solid aqua;
}

where:

<h1>My First Header with a border</h1>

Longhand

Can be applied to an image.

.coloredBorderBox {
	width: 20px; 
	height: 20px; 
	border-left: 4px solid aqua;
	border-right: 4px solid red;
	border-bottom: 4px solid black;
	border-top: 4px solid blue;
}
<p class="coloredBorderBox "></p>

Round (Radius)

.roundedBorderBox {
    width: 40px; 
    height: 40px; 
    border: 2px solid blue;
    border-radius: 10px;
}
<p class="roundedBorderBox"></p>

Documentation / Reference


Powered by ComboStrap