<div class="fr-select-group">
    <label class="fr-label" for="select">
        Label pour liste déroulante
    </label>
    <select class="fr-select" id="select" name="select">
        <option value="" selected disabled hidden>Selectionnez une option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
</div>

<div class="fr-select-group fr-select-group--disabled">
    <label class="fr-label" for="select-disabled">
        Label pour liste déroulante
    </label>
    <select class="fr-select" disabled id="select-disabled" name="select-disabled">
        <option value="" selected disabled hidden>Selectionnez une option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
</div>

<div class="fr-select-group">
    <label class="fr-label" for="select-hint">
        Label pour liste déroulante
        <span class="fr-hint-text">Texte de description additionnel</span>
    </label>
    <select class="fr-select" id="select-hint" name="select-hint">
        <option value="" selected disabled hidden>Selectionnez une option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
</div>

<div class="fr-select-group fr-select-group--valid">
    <label class="fr-label" for="select-valid">
        Label pour liste déroulante
    </label>
    <select class="fr-select fr-select--valid" aria-describedby="select-valid-desc-valid" id="select-valid" name="select-valid">
        <option value="" selected disabled hidden>Selectionnez une option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
    <p id="select-valid-desc-valid" class="fr-valid-text">
        Texte de validation
    </p>
</div>

<div class="fr-select-group fr-select-group--error">
    <label class="fr-label" for="select-error">
        Label pour liste déroulante
    </label>
    <select class="fr-select fr-select--error" aria-describedby="select-error-desc-error" id="select-error" name="select-error">
        <option value="" selected disabled hidden>Selectionnez une option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
    <p id="select-error-desc-error" class="fr-error-text">
        Texte d’erreur obligatoire
    </p>
</div>