Exercice 5/7

  • Complétez votre profil avec des listes imbriquées en utilisant au moins une liste ordonnée (<ol>) et une liste non ordonnée (<ul>).

Leçon 5/7

Chaque section de votre profil va devoir être complétée : la section Mes centres d'intérêts peut elle-même se subdiviser à la manière d'une liste.

Vous pouvez donc imbriquer une nouvelle liste (ordonnée ou pas) dans les balises <li> de votre liste principale, comme ceci :

  • Mes centres d'intérêt
    1. Le développement informatique
    2. La natation
    3. Jouer de la guitare

Regardez à droite, nous l'avons fait pour vous (avec une liste ordonnée <ol>) !

**

Petit rappel sur la structure des listes non ordonnées :

<ul>
    <li>Un élément
    <li>Un autre élément
</ul>

Et sur la structure des listes ordonnées :

<ol>
    <li>Premier élément
    <li>Second élément
</ol>

Quant à la structure de listes imbriquées : :

<ul>
    <li>Mes centres d'intérêts
        <ul>
            <li>L'aviation
            <li>Un bon coup de fourchette
            <li>Le Raspberry Pi
        </ul>
    </li>
    <li>Mes équipes préférées
</ul>

**

Commentaires les mieux notés

  • caropatou1-85

    caropatou1-85

    comment mettre une photo de l ordinateur?

    le 19/03/2020 à 09h20

  • meriam

    meriam Admin

    Bonjour, vous ne pouvez pas mettre des images de l'ordinateur pour les exos de cette plateforme. Utilisez des images de l'internet : il suffit de choisir l'image que vous voulez puis clic droit sur le bouton de la souris et cliquez sur copier l'adresse de l'image.

    le 19/03/2020 à 13h31

  • alexy.loiko

    alexy.loiko

    "au moins une sous catégorie est manquante". Je ne comprends pas

    le 25/06/2019 à 08h48

  • meriam

    meriam Admin

    Bonjour, essayez de simplifier votre code, cliquez sur le bouton reset pour obtenir le code de départ, à partir de ce code, utilisez les listes imbriquées. Pour chaque élément li de la liste principale, créez une sous liste imbriquée ul ou ol.

    le 25/06/2019 à 09h23

  • palisse.david44-65

    palisse.david44-65

    Pour tout ceux qui comme moi ont l'erreur "au moins une sous catégorie est manquante" alors que vous avez tout testé avec des ol et des ul partout, faites comme moi, passez à l'exercice suivant, copiez le code, revenez en arrière collez le et faites valider!

    le 07/12/2018 à 15h09

  • ChildericHD

    ChildericHD

    c'est bon j'ai trouvé merci a vous

    le 08/01/2020 à 18h25

  • romain.foucault

    romain.foucault

    bonjour ça me marque cela : Erreur(s) : Il n'y a pas de contenu dans les balises <li> des sous-catégories. je ne comprend pas j'étais censé faire comment ?

    le 18/11/2018 à 18h33

20 Commentaires

  • x418d4s-71

    x418d4s-71

    Bonsoir, faut-il créer des catégories après le code et de ce fait créer des listes imbriquées ordonnées et désordonnées ou alors compléter les listes dejà faites ? Car quoi que je fasse j'ai la même erreur " au moins une sous-catégorie est manquante"

    le 29/06/2020 à 23h21

  • meriam

    meriam Admin

    Bonsoir, une sous liste doit être intégré dans chaque li de la liste.

    le 29/06/2020 à 23h53

  • clemlemenager-42

    clemlemenager-42

    J'ai aussi le message d'erreur "une sous categorie est manquante"..

    le 28/06/2020 à 15h42

  • meriam

    meriam Admin

    Il faut ajouter une sous liste pour chaque élément li de la liste principale (qui se trouve juste aprés le paragraphe p)

    le 29/06/2020 à 01h23

  • nicolas41-57

    nicolas41-57

    Même chose pour moi, j'ai fais Reset mais toujours pareil !

    le 22/06/2020 à 15h52

  • meriam

    meriam Admin

    Bonjour, il faut insérer une sous liste à l'intérieur de élément "li" de la liste principale et non pas aprés. Regardez le modèle des listes imbriquées dans Astuces.

    le 22/06/2020 à 16h49

  • levoguer.yoann-94

    levoguer.yoann-94

    Bonjour, message d'erreur "une sous-catégorie est manquante" alors que tout fonctionne bien chez moi.

    le 16/04/2020 à 17h02

  • meriam

    meriam Admin

    Vous avez modifié le code initial (cliquez sur le bouton reset pour récupérer ce code et refaites l'exercice).

    le 17/04/2020 à 02h06

index.html
<!DOCTYPE html> <html> <head> <title>Mon titre</title> </head> <body> <img src="https://3wa.fr/wp-content/themes/3wa2015/img/logos/big.png"> <p>Ceci est ma description.</p> <ul> <li> Centres d'intérêts </li> <li> Expériences </li> <li> Formation </li> <li> Citations favorites </li> </ul> </body> </html>