๋ฐ์ํ
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>ํ๋ฐํธ์๋ ๊ฐ๋ฐ์ ์ง์์</title>
<style>
#container {
width:520px;
border:1px solid black;
padding:20px 40px;
margin:0 auto;
}
legend { font-weight:bold; }
ul {list-style-type: none;}
li { line-height:30px;}
</style>
</head>
<body>
<div id="container">
<h1>ํ๋ฐํธ์๋ ๊ฐ๋ฐ์ ์ง์์ </h1>
<p>HTML, CSS, Javascript์ ๋ํ ๊ธฐ์ ์ ์ดํด์ ๊ฒฝํ์ด ์๋ ๋ถ์ ์ฐพ์ต๋๋ค.</p>
<hr>
<form>
<h4>๊ฐ์ธ์ ๋ณด</h4>
<ul>
<li>
<label for="name">์ด๋ฆ</label>
<input type="text" id="name" placeholder="๊ณต๋ฐฑ ์์ด ์
๋ ฅํ์ธ์" autofocus required>
</li>
<li>
<label for="tel">์ฐ๋ฝ์ฒ</label>
<input type="tel" id="tel" required>
</li>
</ul>
<h4>์ง์ ๋ถ์ผ</h4>
<ul>
<li><label><input type="radio" name="field">์น ํผ๋ธ๋ฆฌ์ฑ</label></li>
<li><label><input type="radio" name="field">์น ์ดํ๋ฆฌ์ผ์ด์
๊ฐ๋ฐ</label></li>
<li><label><input type="radio" name="field">๊ฐ๋ฐ ํ๊ฒฝ ๊ฐ์ </label></li>
</ul>
<h4>์ง์ ๋๊ธฐ</h4>
<label>
<textarea cols="60" rows="5" placeholder="๋ณธ์ฌ ์ง์ ๋๊ธฐ๋ฅผ ๊ฐ๋ตํ ์จ ์ฃผ์ธ์"></textarea>
</label>
<div>
<input type="submit" value="์ ์ํ๊ธฐ">
<input type="reset" value="๋ค์ ์ฐ๊ธฐ">
</div>
</form>
</div>
</body>
</html>