html
5장 예제 - readonly와 required 속성 사용하기
쥬크버그
2023. 3. 23. 15:59
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>readonly와 required 속성 사용하기 </title>
</head>
<body>
<form>
<fieldset>
<legend> 배송정보</legend>
<ul id="shipping">
<li>
<label for="prod">주문상품</label>
<input type="text" id="prod" value="상품용 3kg" readonly>
</li>
<li>
<label for="user-name"> 이름</label>
<input type="text" id="user-name" autofocus required>
</li>
<li>
<label for="addr">배송주소</label>
<input type="text" id="addr" required>
</li>
<li>
<label for="umail">이메일</label>
<input type="email" id="umail" required>
</li>
<li>
<label for="phone">연락처</label>
<input type="tel" id="phone"placeholder="하이픈 빼고 입력해 주세요" required>
</li>
<li>
<label for="d-day">배송지정</label>
<input type="date" id="d-day"><small>주문일로부터 최소 3일 이후 </small>
</li>
</ul>
</fieldset>
<div>
<input type="submit" value="주문하기">
<input type="reset" value="취소하기">
</div>
</form>
</body>
</html>