Titre

Nous pouvons voir que chaque section a un petit titre: Sommeil, Nourriture et Boutique. Celles-ci nous parlent des petites listes situées juste en dessous de chacune d’elles. Nous avons déjà utilisé un

pour notre introduction en haut de la page, donc pour ceux-ci nous allons utiliser

, comme ça:

  
 
Dormir
 
 

Des listes

Il existe deux types de listes HTML, commandé (avec des chiffres) et non ordonné (avec des points de balle au lieu de chiffres). Ce sont des moyens très pratiques d’énumérer des informations connexes et chaque section de notre site contient un court non ordonné liste (

) Avec deux éléments.


Imbriqués dans chaque liste sont liste des éléments. Ce sont les éléments qui composent notre liste et ils sont écrits dans

• Mots clés.

  Liens

  Les listes que nous venons de dresser sont censées être liens afin que nos visiteurs puissent cliquer sur ceux-ci pour obtenir plus d’informations. Pour transformer un mot (ou des mots) en un lien cliquable, nous devons envelopper ce mot dans ancre Mots clés. Un élément d'ancrage ressemble à ceci: .

  

  Semblable à la façon dont notre l'élément a des attributs spéciaux, l'ouverture la balise devra contenir un attribut qui comprend l’adresse Web du site Web vers lequel nous voulons que l’utilisateur soit envoyé, le href attribut.

  Le code suivant nous donnerait un lien lié au mot «ici» qui conduirait l'utilisateur à http://tutsplus.com/

  Pour plus de tutoriels cliquez ici.

  C’est exactement comme cela que nous ajouterons les liens à notre liste, en emballant chaque nom de boutique dans un ancre. Les balises d’ancrage d’ouverture et de fermeture se trouveront dans l’élément de liste,

• . La seule différence est que, comme ce ne sont pas de vrais magasins, avec de vrais sites web, nous allons mettre un # pour le href valeur et en cliquant dessus ne nous mènera pas à un autre site.

  Voici un aperçu du tout premier magasin répertorié:

   
  L'auberge Snooze
   

  Nous avons créé une liste non ordonnée, imbriqué un élément de la liste dans cette liste, puis intégré le nom de la boutique dans une balise d'ancrage. Gardez à l'esprit que nous n'avons pas encore stylisé, donc pour le moment notre aperçu affichera les liens en bleu par défaut au lieu de l'orange..

  Conclusion de la section

  Une fois que nous aurons terminé une section complète, nous devrons répéter les mêmes étapes pour les deux dernières sections. Chaque fois, nous devons nous assurer que le contenu change. la structure HTML sera la même pour les trois sections, mais le texte et les images seront différents.

  Maintenant, passons en revue le code pour les trois sections - c'est beaucoup!

   
    
   
  Dormir
   
   
   L'auberge Snooze 
   
   Zzz Hotel 
   
   
   
   
    
   
  Aliments
   
   
   Juste des cookies 
   
   Gâteau aussi 
   
   
   
   
    
   
  Boutique
   
   
   Défilé de chiots 
   
   Chatons cool 
   
   
   
   

  Bas de page

  UNE