• Prog Web /
• HTML/CSS /
• CSS /

Html et Css : Mise en page d'un site

On veut réaliser un site qui regroupe des personnes importantes de divers domaines, pour obtenir la présentation suivante. Nous allons écrire l'HTML, puis réaliser progressivement les CSS correspondantes.

1. Écrire le HTML nécessaire pour coder cette page (sans utiliser de tableau). On se limitera à deux informaticiens.

   Info Les données et photos proviennent de wikipédia.

   Important On utilisera les balises htm5 d'organisation d'un site : header, nav, footer, section, aside, etc ...

2. Pour l'instant, les informaticiens sont les uns sous les autres.
   1. Donner les CSS nécessaires pour obtenir les couleurs, polices de caractères, taille de caractères, correspondant à l'affichage désiré.
   2. Donner les CSS nécessaires pour l'affichage des diverses bordures.
   3. Donner une solution pour l'affichage de l'entête.
   4. Proposer des CSS qui mettront les (mini) biographies au bon endroit.
   5. Proposer une solution pour le menu de navigation.
   6. Proposer un solution pour le pied de page.

      Attention Rien ne doit recouvrir le pied de page, qui doit etre positionné en dessous de la zone d'affichage des informaticiens, et de la zone des biographies.

3. On veut que le nombre d'informaticiens par ligne s'adapte à la place disponible.
   1. Proposer une solution en utilisant float pour la mise en page.
   2. Proposez une solution en utilisant inline-block pour la mise en page.

Construire un document HTML et un document CSS produisant l'affichage ci- dessous, le fichier HTML ne devra contenir aucun attribut de balise et ne devra utiliser que les balises h1, p et div.

retour à la page d'accueil

retour au sommet