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
L' entête et le pied de page sont centrés sur fond mauve.
Dans l'en-tête de chaque page, on dispose de fonctionnalités de
navigation dans la hiérarchie des pages (exemple Accueil>Recettes
simples>Œufs sur le plat).
Le pied de page comprend une information (ici NFA016 et le logo du
cnam) situé à droite. Le logo a la largeur de 2 lettre M.
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:
L' entête et le pieds de page sont conformes à la charte.
Chaque nom de recette apparaît sur une ligne précédée d'une
illustration.
Les illustration ont 3 fois la hauteur de la lettre M
Les lignes sont en alternance sur fond blanc et sur fond
violet.
Cliquer sur un nom de recette renvoie à la page de description
correspondante.
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:
L' entête et le pied de page sont conformes à la charte.
L'illustration de la recette est à droite avec une légende en petit
caractères
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)
Les noms des ingrédients apparaissent en bleu
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