Architecture et langages Web (NFA040)

Exercices ( HTML et CSS )

Olivier Pons
(pons@cnam.fr)

2022

On veut réaliser un site de recettes de cuisine. Il se compose de plusieurs pages. Entre autres une page d'accueil (que l'on ne demande pas de réaliser), une page affichant les recettes simples et une page associée à chaque recette.

La charte du site impose que chaque page dispose d'un entête et d'un pied de page

N'oubliez pas de valider vos pages HTML avec les validateurs pour HTML et pour CSS

La page des recettes simple

On vous demande de réaliser une pages des recettes simples qui ressemble à celle présentée ci-dessous:

une photo de la page des recettes simples

Page Spécifique

A titre d'exemple on vous demande de réaliser la page correspondant à la recette des Œufs sur le plat de manière à ce qu'elle ressemble à celle ci-dessous:

une photo de la page des oeufs
  1. L' entête et le pied de page sont conformes à la charte.
  2. L'illustration de la recette est à droite avec une légende en petit caractères
  3. Les ingrédients sont listés dans une zone à fond vert pâle et dans une police sans-serif. Chaque élément de la liste est indexé par une lettre (par ordre alphabétique)
  4. Les noms des ingrédients apparaissent en bleu
  5. Les commentaires sont en rouge, décalés d'une largeur équivalente à 5 lettres M vers la droite.

Les images utilisé sont disponibles au téléchargement