![[2021/12/31]국비지원 CSS3 11-(5) form appearance, outline](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fc0Fgtr%2Fbtrr2tbmQQL%2FAAAAAAAAAAAAAAAAAAAAAFagBgKgDCjfJNW-ZL78brYJBUdtcqTvkOm1p9FMJbNP%2Fimg.jpg%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1759244399%26allow_ip%3D%26allow_referer%3D%26signature%3DIZ8L4m4ykkyArfSMTfG%252Bo5P1egg%253D)
★★★★★ 브라우저 식별 접두사 필요한 속성 ★★★★★
appearance : none )) 폼 외관 초기화
브라우저 식별 접두사 없어도 되는 property
outline-offset : 외곽선과 border 간격
outline : 외곽선
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>appearance, outline</title>
<style type="text/css">
input,textarea,select{-webkit-appearance:none;appearance: none;border: 1px solid orange;}
div{border: 10px double #aaa;outline:5px solid red;outline-offset: 5px;}
</style>
</head>
<body>
<form action="/" method="post">
<fieldset>
<legend>회원가입양식</legend>
<input type="text"><br>
<textarea cols="30" rows="5">form 속성의 고유한 디자인을 초기화 해서 모든 웹브라우저에서 동일하게 보이도록 하는 속성</textarea><br>
<select>
<option>010</option>
</select>
</fieldset>
</form>
<hr>
<div>outline은 border영역 외곽에 테두리 치는 속성</div>
</body>
</html>
결과물
