Header
Partagez | 

[Tuto html] Faire des listes

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:

Miettes

Doyenne
Bons Points (BP) : 233
Voir le profil de l'utilisateur

Message Sujet: [Tuto html] Faire des listes   Lun 22 Déc - 18:53

Bonjour à tous !

Dans ce tuto, nous allons apprendre comment coder une page pour mettre en forme une liste.




1/ Faire une liste à puces

Ici nous allons utiliser la balise
Code:
<ul> …..</ul>
Cette balise « indique » que nous allons commencer une liste à puce.

Ensuite, pour préciser chaque élément de notre liste, nous allons utiliser les balises :
Code:
<li>….</li>
Cette balise est utilisé quelque soit le type de liste.

Voici un exemple de liste à puce :


Et voici le code à mettre pour la réaliser :
Code:
 Mes séries préférées
<ul><li> Science Fiction // Fantastique
   <ul><li> Farscape</li>
      <li> 3ième planète après le soleil</li>
      <li> Heroes</li></ul></li>
   <li> Policier
   <ul><li> NCIS</li>
      <li> Colombo</li>
      <li>Arabesque</li></ul></li>
   <li> Comédie
   <ul><li> Desperate Housewives</li>
      <li> Friends</li>
      <li> Ma tribu</li>
      <li> That's 70's Show</li></ul>   </li>   
</ul>

Vous l’avez donc remarqué, vous pouvez mettre des listes dans des listes Smile Ici par exemple, nous avons une plusieurs listes avec le genre des séries (science fiction, policier, comédie) et chaque type de séries à sa propre liste avec le nom des séries cette fois.


2/ Faire une liste numérotée

Ici nous n’allons pas utiliser la même balise que précédemment. Pour faire une liste numérotée, nous avons besoin de la balise suivante :
Code:
<ol>….</ol>
Et de la même balise « liste » que ci-dessus.

Voici un petit exemple :


Et le code utilisé : Mes séries préférées
Code:
<ol><li> Science Fiction // Fantastique
      <ol><li> Farscape</li>
         <li> 3ième planète après le soleil</li>
         <li> Heroes</li></ol>
   </li>
   <li> Policier
      <ol><li> NCIS</li>
         <li> Colombo</li>
         <li>Arabesque</li></ol>
   </li>
   <li> Comédie
      <ol><li> Desperate Housewives</li>
         <li> Friends</li>
         <li> Ma tribu</li>
         <li> That's 70's Show</li></ol>
   </li>
</ol>


Et voilà, vous savez à présent insérer des listes dans vos pages html.

Si un des points ne vous semblent pas clair, dites le Smile




Vous rencontrez un souci avec ce tutoriel ? Venez poser votre question [ici].

Idea N'oubliez pas de lire et de suivre les [règles de la section].

Je soussignée, Miettes,  accepte qu'un directeur reposte le tutoriel "Faire des listes" tel que je l'ai rédigé.


Dernière édition par Miettes le Mer 20 Jan - 0:15, édité 1 fois
Revenir en haut Aller en bas


[Tuto html] Faire des listes
Page 1 sur 1
 Sujets similaires
-
» Blabla Land [Accepté]
» gmapsupp
» Tuto comment faire un tryptique avec photoshop ou the gimp
» [Annulée] Demande une page HTML
» [résolu] Lien dans image survolée vers page html
Réponse rapide

School of Progress :: La bibliothèque :: Tutoriels :: Informatique :: Codage+