div {
border-width: medium;
padding: 5px;
margin: 5px 10px;
}
.ex1 {border-style: none;}
.ex2 {border-style: hidden;}
.ex3 {border-style: dotted;}
.ex4 {border-style: dashed;}
.ex5 {border-style: solid;}
.ex6 {border-style: double;}
.ex7 {border-style: groove;}
.ex8 {border-style: ridge;}
.ex9 {border-style: inset;}
.ex10 {border-style: outset;}
<!DOCTYPE html>
<html lang="ko">
<head></head>
<body>
<div class="ex1">none</div>
<div class="ex2">hidden</div>
<div class="ex3">dotted</div>
<div class="ex4">dashed</div>
<div class="ex5">solid</div>
<div class="ex6">double</div>
<div class="ex7">groove</div>
<div class="ex8">ridge</div>
<div class="ex9">inset</div>
<div class="ex10">outset</div>
</body>
</html>