Css

1. M31 : Technologies du Web
LST-MI – S6
TP8 : CSS
FST Al-Hoceima
2021/2022 Pr : A.Zannou
Objective :
Mise en forme de votre mini-site
Préparation du TP
Vérifiez que le contenu de votre répertoire (images + index.html).
Exercice 1 :
Il est important de définir une "charte graphique", qui définira une apparence uniforme pour toutes les
pages de votre site. Pour cela, en utilisant les feuilles de style CSS, mettez en forme votre mini-site (sans
modifier le document index.html). Définir barre de navigation, comme montre le figure ci-dessous.
Exercice 2: Sélecteurs d'attributs
Le site peut contenir des images. Certaines images peuvent être des liens hypertextes, d'autres non. On
souhaite les distinguer selon qu'elles supportent un lien ou non. Ainsi toutes les images auront une bordure
de 10 pixels avec la couleur :
 Rouge pour les images ne supportant pas de lien,
 bleu ciel d'épaisseur pour les images supportant un lien vers Wikipédia,
 violette pour les images pour les images supportant un lien vers un site autre que Wikipédia,
Modifiez vos styles de façon à ce que image soient affichées comme indiqué ci-dessus (sans la
modification du document index.html).
Images avec un lien vers
Wikipédia (bordure blue ciel
#B6DCF6)
Images sans lien
(bordure rouge)
Images avec lien un
autre site que
Wikipédia (bordure
violette blueviolet)

2. M31 : Technologies du Web
LST-MI – S6
TP8 : CSS
FST Al-Hoceima
2021/2022 Pr : A.Zannou