fieldset element - by. UXKM

fieldset element 설명

<fieldset> 요소는 <form> 요소에서 연관된 요소들을 하나의 그룹으로 묶을 때 사용합니다.
<fieldset> 요소는 하나의 그룹으로 묶은 요소들 주변으로 박스 모양의 선을 그려줍니다.
또한, <legend> 요소를 사용하면 <fieldset> 요소의 캡션(caption)을 정의할 수 있습니다.

HTML5에서는 <fieldset> 요소에 새로운 속성들이 추가되었습니다.

CSS 기본값 :

9.13.1. fieldset 속성

[name] <fieldset name="숫자">

name 속성은 <fieldset> 요소의 이름을 명시합니다.
name 속성은 자바스크립트에서 요소를 참조하거나, 폼이 제출된 뒤 폼 데이터(form data)를 참조할 때 사용됩니다.

[disabled] <fieldset disabled>

disabled 속성은 <fieldset> 요소에 포함된 <form> 요소들이 비활성화됨을 명시합니다.
disabled 속성이 명시된 <fieldset> 요소에 포함된 모든 요소들은 사용할 수 없으며 사용자가 클릭할 수도 없습니다.
따라서 이 속성을 사용하면 특정 조건이 충족될 때까지 사용자가 <fieldset> 요소에 포함된 요소들을 클릭할 수 없도록 설정하고, 특정 조건이 충족되면 자바스크립트 등으로 disabled 속성값을 삭제하여 사용자가 다시 요소들을 사용할 수 있도록 조정할 수 있습니다.

disabled 속성은 불리언(boolean) 속성입니다.
불리언 속성은 해당 속성을 명시하지 않으면 속성값이 자동으로 false 값을 가지게 되며, 명시하면 자동으로 true 값을 가지게 됩니다.
엣지 브라우저의 경우 중첩된 <fieldset> 요소에서는 disabled 속성이 제대로 적용되지 않습니다.
<fieldset disabled><fieldset><!-- 여전히 사용할 수 있습니다. --></fieldset></fieldset>

[form] <fieldset form="form id">

<fieldset> 요소에 포함될 <form> 요소의 id를 명시합니다.
이 속성값은 반드시 같은 문서 내에 존재하는
요소의 id 속성값이어야 합니다.