# Radios

Un choix parmi plusieurs options mutuellement exclusives, toutes visibles.

## Playground

```html
<fieldset class="feitio-fieldset"><legend class="feitio-label">À quelle fréquence ?</legend><div class="feitio-choices"><label class="feitio-choice"><input type="radio" name="pg-r" value="Chaque jour">Chaque jour</label><label class="feitio-choice"><input type="radio" name="pg-r" value="Chaque semaine" checked>Chaque semaine</label><label class="feitio-choice"><input type="radio" name="pg-r" value="Chaque mois">Chaque mois</label></div></fieldset>
```

## Quand l'utiliser

-   Pour sélectionner exactement un parmi deux à six options.

## Quand ne pas l'utiliser

-   **Beaucoup d'options :** Sélectionner.
-   **Plusieurs choix :** Case à cocher.
-   **Deux ou trois options voisines qui changent l'affichage immédiatement** (jour et nuit, une liste ou un grille) : SegmentedControl.

## Exemples

### Fréquence ?

L'une sous l'autre, dans un Fieldset avec la question.

Afficher le code

```html
<fieldset class="feitio-fieldset">
  <legend class="feitio-label">Com que frequência?</legend>
  <div class="feitio-choices">
    <label class="feitio-choice"><input type="radio" name="frequencia" value="uma-vez">Uma vez</label>
    …
  </div>
</fieldset>
```

## États

Aucun choix

NormalHigh

Choix

NormalHigh

Erreur

NormalHigh

Pick a priority

Désactivé

Urgent (tasks only)

## Faire et ne pas faire

Do

NormalHighUrgent

L'un sous l'autre, et aucun non pré-sélectionné lorsque le choix importe.

Don’t

NormalHighUrgent

Des options entassées sur une seule ligne : difficile de voir quel cercle appartient à quel texte.

## Accessibilité

-   Toujours dans un Fieldset avec un titre ; les flèches directionnelles se déplacent entre les options.
-   Côté à côté uniquement pour deux options courtes, comme « Oui » et « Non ».

## Attributs

Attribut

Valeurs

Pour quoi

`class="feitio-choices"`

autour

`space-2` entre les options.

`class="feitio-choice"`

sur la `<label>`

Cercle et texte cliquables ensemble.

`name`

le même partout

Un choix par groupe.

`checked`

—

Seulement s'il y a un défaut raisonnable.