Travail personnel
Exercice 1 — Expérimenter avec CSS #
Cet exercice fait partie de ceux qui seront évalués. La page doit être accessible et fonctionnelle à l'URL suivante :
https://dev-LOGIN.users.info.unicaen.fr/1HU91-2024/TP04/ex1/tbl.html(en remplaçant LOGIN par votre identifiant numérique). Pensez à vérifier la validité W3C de votre page !
D'autre part,
l'élément head doit contenir le code suivant :
<meta name="author" content="LOGIN" />en remplaçant LOGIN par votre identifiant numérique. (Il faut laisser
name="author" tel quel, par contre !) Par exemple, si votre identifiant est lecarp213, vous mettez
<meta name="author" content="lecarp213" />
dans le head de votre page. Pour cet exercice, il est interdit de travailler en binôme.
Il est conseillé de vérifier que l'exercice a été correctement rendu en utilisant l'application evalweb.
Vous avez jusqu'au vendredi 26 janvier pour terminer l'exercice et le déposer sur votre serveur web.
La page web fournie dans cette archive servira de terrain d'expérimentation.
Créer un fichier CSS et ajouter la balise link permettant de lier la page HTML au fichier CSS créé.
Utiliser cet index des propriétés CSS ou ce mémento CSS pour trouver les propriétés à appliquer, leur syntaxe correcte et les valeurs possibles.
Compléter le fichier CSS pour appliquer les mises en forme suivantes :
- Mettre une police sans empattement pour les textes de la page et une taille de police de 16 pixels
- mettre le titre principal aligné au centre et en italique et augmenter la taille de sa police
- mettre la police du pied de page en bleu et en plus petit
- mettre les titres de section en bleu et avec une police à empattement
- enlever le soulignement des liens
- mettre des puces carrées à la place des puces rondes dans la liste de la 2e section
- mettre le titre de la navigation en police Arial italique
- enlever les puces de la liste de navigation
- mettre les liens de navigation (seulement ceux-là) en vert et soulignés, et au survol de la souris ces liens deviennent rouges et non soulignés
- ajouter un cadre autour de la figure (essayer plusieurs styles et plusieurs épaisseurs)
- changer la couleur de fond de la page, tout en gardant un fond blanc pour les paragraphes
- mettre le premier paragraphe de chaque section en italique et avec une largeur de 70% de la page