Exercice HTML: Site de Librairie
Rédigé par BENKIRANE Fatima Ezzahra, Publié le 11 Janvier 2012, Mise à jour le Samedi, 29 Août 2020 23:30Participez au vote ☆☆☆☆☆★★★★★
On veut réaliser un site de librairie en ligne pour obtenir la présentation suivante. Nous allons écrire le HTML, puis réaliser progressivement les CSS correspondantes.
Écrire le HTML nécessaire pour coder cette page (sans utiliser de tableau). On se limitera à deux livres.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 |
<html> <head> <link rel="stylesheet" type="text/css" href="style.css" /> <meta charset="UTF-8"> <title>Librairie en ligne</title> </head> <div class="entete"> <h1>Site de Librairie</h1> <p>Libraires en lignes depuis 1820</p> </div> <div class="menu"> <div class="entree">Statistiques</div> <div class="entree selectionnee">Romans</div> <div class="entree">Science</div> </div> <div class="principal"> <div class="corps"> <div class="livre"> <h1> Quatrevingt-treize</h1> <img src="book.png"> <h2> Victor Hugo</h2> <p>Roman de Victor Hugo sur la Révolution Française. </p> <p class="commentaire">Nombre de commentaires: 240</p> </div> <div class="livre"> <h1> Quatrevingt-treize</h1> <img src="book.png"> <h2> Victor Hugo</h2> <p>Roman de Victor Hugo sur la Révolution Française. </p> <p class="commentaire">Nombre de commentaires: 240</p> </div> <div class="livre"> <h1> Quatrevingt-treize</h1> <img src="book.png"> <h2> Victor Hugo</h2> <p>Roman de Victor Hugo sur la Révolution Française. </p> <p class="commentaire">Nombre de commentaires: 240</p> </div> <div class="livre"> <h1> Quatrevingt-treize</h1> <img src="book.png"> <h2> Victor Hugo</h2> <p>Roman de Victor Hugo sur la Révolution Française. </p> <p class="commentaire">Nombre de commentaires: 240</p> </div> <div style="clear: both"></div> </div> <div class="nouvelles"> <h1> Nouvelles</h1> <p>La librairie en ligne accueillera bientôt des auteurs en direct.</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> <p>d'autres nouvelles...</p> </div> </div> </html> |