CSS Borders Short-hand Example

<!Doctype HTML>
<html>
<head>
<title>CSS Borders Color</title>
<style>
	h2{
		font-size: 25px;
		color: blue;
		font-family: 'Roboto', sans-serif;
		border: 5px solid #29b6f6;
	}
	.border-1 {
	  border-style: solid;
	  border-color: Crimson;
	  border-width: thick;
	  padding: 10px;
	  margin: 10px;
	  text-align: center;
	}
	.border-2{
	  border-style: dashed;
	  border-color: rgb(0,255,0);
	  border-width: thick;
	  padding: 10px;
	  margin: 10px;
	  text-align: center;
	}
	.border-3{
	  border-style: solid;
	  border-color: #0000ff;
	  border-width: thick;
	  padding: 10px;
	  margin: 10px;
	  text-align: center;
	}
	.border-4{
	  border-style: solid;
	  border-color: hsl(10,40%, 90%);
	  border-width: thick;
	  padding: 10px;
	  margin: 10px;
	  text-align: center;
	}
	.border-5{
	  border-style: solid;
	  border-color: Crimson DeepSkyBlue Black Orange;
	  border-width: thick;
	  padding: 10px;
	  margin: 10px;
	  text-align: center;
	}
</style>
</head>
<body>
	<h2>CSS Border Color</h2>
	We can set the colors of border by border short-hand property.
	<h2>Border Short-hand Property</h2>
	<p class="border-1">Border color is Crimson, set by name.</p>
	<p class="border-2">Border color is set by rgb value and is green.</p>
	<p class="border-3">The border is blue and set by hex value.</p>
	<p class="border-4">This border is set by hsl value.</p>
	<p class="border-5">All different border colors</p>
</body>
</html>