-->
<form>
<fieldset style="width:300px;">
<legend>인적사항</legend>
이름 : <input type="text" name="irum" placeholder="이름 입력" autofocus><br><br>
전화 : <input type="text" name="phone_number" placeholder="전화번호 입력"><br><br>
주소 : <input type="text" name="address" placeholder="주소 입력" value="대전시" readonly><br><br>
</fieldset>
<fieldset>
<legned>checkbox객체, radio객체와 label 연결</legned><br><br>
좋아하는 과일 :
<input type="checkbox" name="aa" value ="사과" id = "test1"><label for="test1">사과</label>
<input type="checkbox" name="aa" value ="딸기" id = "test2"><label for="test2">딸기</label>
<input type="checkbox" name="aa" value ="멜론" id = "test3"><label for="test3">멜론</label>
<br><br>
좋아하는 과일 :
<input type="radio" name="aa" value ="사과" id = "test4"><label for="test4">사과</label>
<input type="radio" name="aa" value ="딸기" id = "test5"><label for="test5">딸기</label>
<input type="radio" name="aa" value ="멜론" id = "test6"><label for="test6">멜론</label>
<br><br>
</fieldset>
</form>
<fieldset>태그
입력 요소들을 그룹으로 묶어서 표현할 때 사용하는 태그
<legend>태그
fieldset태그의 하위 태그로 fieldset의 제목을 지정할때 사용한다.
입력 요소에 사용하는 속성들
placeholder 입력 힌트를 희미하게 보여 준다.
autofocus 페이지가 로드되면 자동으로 포커스를갖는다.
readonly 읽기 전용상태로 만든다.
disabled 객체를 비활성화 시킨다. 이 속성이 설정된 입력요소의 데이터는 서버로 전송이 안된다.
'HtmlCss > HTML' 카테고리의 다른 글
div, article, section 정리 (0) | 2020.03.19 |
---|---|
HTML5 추가요소 (0) | 2019.05.25 |
<Form>태그 (0) | 2019.05.25 |
<Table>태그 (0) | 2019.05.25 |
특수문자 (0) | 2019.05.25 |