728x90
반응형
-code-
<!DOCTYPE html>
<html>
<head>
<style>
p {outline-color:green;}
p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;}
</style>
</head>
<body>
<h2>outline-style</h2>
<p class="dotted">작은 점선</p>
<p class="dashed">큰 점선</p>
<p class="solid">실선</p>
<p class="double">실선 2개</p>
<p class="groove">외각선</p>
<p class="ridge">외각선 밖</p>
<p class="inset">외각선 왼쪽위</p>
<p class="outset">외각선 오른쪽 아래</p>
</body>
</html>
결과물
outline-style
작은 점선
큰 점선
실선
실선 2개
외각선
외각선 밖
외각선 왼쪽위
외각선 오른쪽 아래
728x90
반응형
'Coding > HTML & CSS' 카테고리의 다른 글
[HTML & CSS] 검색, 입력창에 값 넣기(datalist) (0) | 2021.01.13 |
---|---|
[HTML & CSS] 백그라운드(background)에 사진 넣기 (0) | 2020.12.26 |
[HTML & CSS] 이미지(image) 회전 (0) | 2020.12.07 |
[HTML & CSS] a, onclick 태그 (새창/팝업/현재창) 열기 (0) | 2020.12.04 |
[HTML & CSS] 테두리 굴곡(border radius) 주기 (0) | 2020.11.30 |
댓글