Loading

border-radius, dotted, image, solid

Border-Solid, Border-Dotted, Border-Dashed, Border-Image, Border-Radius, Border-None

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>border-radius, dotted, image, solid</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
      <div class="box B_1"> Border-Solid</div>
    <div class="box B_2"> Border-Dotted</div>
    <div class="box B_3"> Border-Dashed</div>
    <div class="box B_4"> Border-Image</div>
    <div class="box B_5"> Border-Radius</div>
    <div class="box B_6"> Border-None</div>
	
<h2> - @wilder_taype</h2>

<!-- Fonts.Google.com -->
<link href="https://fonts.googleapis.com/css?family=Baloo+Bhaina" rel="stylesheet">
  
  
</body>
</html>
/* Downloaded from https://ahoj.co.uk/ */
*{
	font-family: 'Baloo Bhaina', cursive;
	font-size: 20px;
	text-align: center;
}
body{
	color: rgba(27, 79, 114, 0.6);
	background: #e9ebee;
}
.box{
	background: #fff;
	display: inline-block;
	padding: 8% 20px;
	height: 80px;
	width: 300px;
	margin: 1rem;
}
.B_1{
	border: 5px solid rgba(27, 79, 114, 0.4);
}
.B_2{
	border: 5px dotted rgba(27, 79, 114, 0.4);
}
.B_3{
	border: 5px dashed rgba(27, 79, 114, 0.4);
}
.B_4{
	border: 5px solid ;
	border-image: url('//goo.gl/pUypZY') 30 round;
}
.B_5{
	border: 5px solid rgba(27, 79, 114, 0.4);
	border-radius: 5px;
}
.B_6{
	border: none;
}
.B_1, .B_2, .B_3, .B_4, .B_5, .B_6{
	box-shadow: 0 0 1rem 0 rgba(0,0,0,0.3);
}
.box:hover{
	box-shadow: 0 0 35px 20px rgba(79,69,66,0.2);
}
/* Downloaded from https://ahoj.co.uk/ */

This awesome code is write by WILDER TAYPE, you can se more from this user in the personal repository