Fieldset
El título de un grupo de campos u opciones que responden una sola pregunta.
En esta página
Playground
Pista
Fondo
<fieldset class="feitio-fieldset"><legend class="feitio-label">Avisar por</legend><div class="feitio-choices"><label class="feitio-choice"><input type="checkbox" checked>Discord</label><label class="feitio-choice"><input type="checkbox">Correo</label></div></fieldset>Cuándo usarlo
- Alrededor de los grupos de radios y casillas de verificación, siempre.
- Para campos que son una sola cosa: la hora, una dirección.
Cuándo no usarlo
- Para separar partes de una página larga: encabezados y bloques.
Ejemplos
Un grupo con la pregunta
El título es la pregunta; la pista está justo debajo (space-1); el grupo un poco más lejos (space-3); el grupo de error, space-2 desde la última opción.
Mostrar código
<fieldset class="feitio-fieldset">
<legend class="feitio-label">Quando lembrar?</legend>
<span class="feitio-hint">Horário de São Paulo</span>
…
</fieldset>Anatomía
- Título: la pregunta de todo el grupo.
- Pista, opcional: justo debajo del título (
space-1). - El grupo: opciones o campos, un poco más lejos (
space-3).
Accesibilidad
- El
<legend>se anuncia antes de cada campo del grupo: escríbela como la pregunta. - Grupo de error: el mensaje justo debajo de las opciones, con el icono, en vino.
Atributos
| Atributo | Valores | Para qué sirve |
|---|---|---|
class="feitio-fieldset" | obligatorio | El grupo titulado, con los espaciados de la escala. |
<legend> | la pregunta | El título del grupo. |
class="feitio-hint" | opcional | La pista, space-1 del título. |
aria-invalid="true" | con un error | El mensaje debajo del grupo. |