코딩이야기/HTML

HTML 강좌 12강 - HTML 태그 익히기#11 - fieldset

완소줄기 2016. 2. 4. 19:01

HTML 강좌 12강 - HTML 태그 익히기#11 - fieldset


이번에는 fieldset 태그에 대해 알아보겠습니다.

fieldset 이란 어떤 특정한 목적으로 모인 하나의 그룹 이라고 보면 될 듯 합니다.


간단한 예를 들어보겠습니다.

설문조사를 하는데 대상의 취미를 조사하고 싶습니다.

그렇다면 주제.. 즉 field는 '취미'가 되고..

주제에 해당하는 객체들을 셋팅 해야겠죠?

영화감상, 자전거라이딩, 여행, 음악감상

이렇게 객체들을 셋팅한고 하고 fieldset 태그를 사용해 봅니다.


시작태그와 종료태그 사이에 다음과 같은 형식으로 사용합니다.

<fieldset>

<legend>취미</legend>

<input type="checkbox" value="1">영화감상

<input type="checkbox" value="2">자전거라이딩

<input type="checkbox" value="3">여행

<input type="checkbox" value="4">음악감상

</fieldset>


legend 태그는 주제를 설정하는 태그입니다.

input 태그는 입력방식을 설정하는 태그인데 checkbox는 많이 봤던 체크박스 속성 입니다.

input 태그에 대해서는 다음에 진행할 입력방식 폼 태그 강좌에서 다시한번 연습해 보겠습니다.





이렇게 코딩을 하고 테스트를 해봅니다.





이러한 필드셋들이 모여 회원가입 같은 입력양식을 만들수도 있습니다.

다음 강좌에서 입력양식 폼 태그에 대해 연습해 보겠습니다.


예제 파일은 첨부파일에서 받을 수 있습니다 :)


12.zip