HTML - fieldset태그와 label태그 - 입력태그 (4)

HTML - fieldset태그와 label태그

입력태그 (4)

오늘은 이전 포스팅에 이어 

HTML -fieldset태그와 label태그에 

대해서 알아 보도록 하겠습니다.

태그 기초부터 알아보기 전에  

압타나 스튜디오를 직접 설치 하시고 한번씩 따라해 보시기 바랍니다.

(백번 보는 것 보다 한번 살짝 타이핑 해보면 이해 되니! 꼭!)

(굳이 압타나 아니더라도 이클립스등 자신에게 맞는 HTML 툴이 있으시다면 사용하시기 바랍니다.)

fieldset태그란?

먼저 fieldset태그란 입력 요소를 그룹화 하는데 사용되는

태그 이며 fieldset태그를 사용하면서 legend태그를 이용해

그룹에 제목을 붙일 수도 있는데 이 사용법은 아래와 같습니다. ^^

위 는 fieldset 태그안에 legend로 "제목표시"를 넣어주고

아래 는 input태그와 <br>개행을 해가며 3가지 

내용이 들어갈 

텍스트 창을 만들어 보았습니다.

사용하는 방법은 위 와 같으며 한번씩 타이핑 해서

연습해 보시면 좋을 것 같습니다. ^^

label태그란?

먼저 label태그란 input태그를 위한 라벨로 정의 합니다.

label 태그의 속성인 for를 이용해서 라벨과 input 태그를 연결 할 수 있는데요

사용법은 아래와 같습니다. ^^

위 는 label 태그에 for 속성 값을 input태그의 id 속성과 동일하게 주고

웹 브라우저상에 출력을 해보 았습니다.

단지 눈으로 뭐가 변한건지 모르지만 이렇게 태그를 작성 하게 되면

마우스로 체크박스를 클릭하지 않고 글자만 클릭을 해도 

똑같이 체크되는

효과를 나타내게 됩니다.

여기까지 

fieldset태그와 label태그에 대해서 

알아보았으며 

위 태그 같은 경우 

하나씩 써보면 금방 이해가 되실 겁니다. ^^

이상 HTML - fieldset태그와 label태그 - 입력태그 (4)에 

관련된 포스팅을 마치도록 하겠습니다.