HTML fieldset 태그

fieldset 태그를 이용하여 좀더 괜찮은 UI를 얻을 수 있다.
출처 : http://www.w3.org/TR/html4/interact/forms.html#idx-label-2

아래와 같은 정보를 입력|출력하는 화면이 있다고 하자. 어떻게 할 것인가?

레이어가 생각나겠지만 레이어를 사용할 필요없다!!

아래 소스와 같이 <fieldset> 태그와 <legend> 태그만 있으면 멋진 UI가 나온다.

<FORM action="..." method="post">
 <P>
 <FIELDSET>
  <LEGEND>Personal Information</LEGEND>
  Last Name: <INPUT name="personal_lastname" type="text" tabindex="1">
  First Name: <INPUT name="personal_firstname" type="text" tabindex="2">
  Address: <INPUT name="personal_address" type="text" tabindex="3">
  ...more personal information...
 </FIELDSET>
 <FIELDSET>
  <LEGEND>Medical History</LEGEND>
  <INPUT name="history_illness"
         type="checkbox"
         value="Smallpox" tabindex="20"> Smallpox
  <INPUT name="history_illness"
         type="checkbox"
         value="Mumps" tabindex="21"> Mumps
  <INPUT name="history_illness"
         type="checkbox"
         value="Dizziness" tabindex="22"> Dizziness
  <INPUT name="history_illness"
         type="checkbox"
         value="Sneezing" tabindex="23"> Sneezing
  ...more medical history...
 </FIELDSET>
 <FIELDSET>
  <LEGEND>Current Medication</LEGEND>
  Are you currently taking any medication?
  <INPUT name="medication_now"
         type="radio"
         value="Yes" tabindex="35">Yes
  <INPUT name="medication_now"
         type="radio"
         value="No" tabindex="35">No

  If you are currently taking medication, please indicate
  it in the space below:
  <TEXTAREA name="current_medication"
            rows="20" cols="50"
            tabindex="40">
  </TEXTAREA>
 </FIELDSET>
</FORM>

왜 이런것을 사용하지 않았을까?
copy & paste 의 부작용이 아닐까 싶다. -_-
문서를 찾아보지 않고 기존에 만들어져 있는것만 참고해서 만들려고 하다보니 <fieldset>, <legend> 태그가 있는지도 몰랐던 게 아닐까???

기존에 사용했던 것만 이용할 게 아니라 새로운 게 있는지 확인해 보자~~!!!