본문 바로가기

코딩배우기

border-style 속성(테두리)

border-style 속성

이 속성은 표시할 테두리 종류를 지정합니다.


<!DOCTYPE html>

<html>

<head>

<style>

p.dotted {border-style: dotted;}

p.dashed {border-style: dashed;}

p.solid {border-style: solid;}

p.double {border-style: double;}

p.groove {border-style: groove;}

p.ridge {border-style: ridge;}

p.inset {border-style: inset;}

p.outset {border-style: outset;}

p.none {border-style: none;}

p.hidden {border-style: hidden;}

p.mix {border-style: dotted dashed solid double;}

</style>

</head>

<body>


<h2>The border-style Property</h2>

<p>This property specifies what kind of border to display:</p>


<p class="dotted">A dotted border.</p>

<p class="dashed">A dashed border.</p>

<p class="solid">A solid border.</p>

<p class="double">A double border.</p>

<p class="groove">A groove border.</p>

<p class="ridge">A ridge border.</p>

<p class="inset">An inset border.</p>

<p class="outset">An outset border.</p>

<p class="none">No border.</p>

<p class="hidden">A hidden border.</p>

<p class="mix">A mixed border.</p>


</body>

</html>






'코딩배우기' 카테고리의 다른 글

float 속성 연습  (0) 2018.05.06
테이블(Table) 표만드는 요소  (0) 2018.05.05
stroke dashed line 응용하기  (0) 2018.05.04
CSS 테두리 속성  (0) 2018.05.03
글소제목 한 줄 만들기(html)  (0) 2018.05.02