Chapitre 1 : Feuille de styles 3ème STI

Questions :

1. Lancer l’éditeur FrontPage et créer en mode création la page web nommée TP1.html
suivante

2. Mettre en forme le fichier TP1.html en utilisant le fichier nommé style.css qui se

trouve dans le même emplacement que TP1.html.

3. Faire le lien nécessaire entre le fichier TP1.html et style.css avec la balise LINK

<LINK REL= “STYLESHEET “ HREF= “style.css”>

4. Compléter le premier sélecteur body du fichier style.css avec les propriétés qui

conviennent : marge guauche de 50 pixel, couleur du texte navy, couleur

d’arrière plan white, police Aria, Helvetica ou sans-serif.)

BODY { margin-left: 50px ; color: navy ; background-color: white;

font-family: Arial, Helvetica, sans-serif }

5. Compléter le regroupement de sélecteur suivant du fichier style.css avec les

propriétés : texte aligné au centre, police Comic Sans MS ou sans-serif

-1-
Chapitre 1 : Feuille de styles 3ème STI
H1,H2,H3,H4 { text-align: center ; font-family: "Comic Sans MS", sans-serif ;

font-size: large }

6. Ajouter au sélecteur h1 les propriétés indépendantes aux autres titres. Le texte du

titre 1 du TP1 doit être aligné au centre et de couleur white et de couleur de fond

bleu navy.

H1 { text-align: center ; color: white ; background: navy }

7. Les sélecteurs regroupés h2, h3, h4 :

Le texte aligné à gauche, couleur navy, et de couleur de fond bleu

H2,H3,H4 { text-align: left ; color: navy ; background: white }

8. Le sélecteur A pas encore visité de couleur rouge, le sélecteur A visité ou active de

couleur vert.

A:link { color: red }

A:active { color: green }

A:visited { color: green }

9. Le sélecteur TH de couleur de fond silver

TH { background: silver }

10.Les sélecteurs regroupés TH et TD de police Arial ou Helvetica ou sans-serif

TH,TD { font-family: Arial, Helvetica, sans-serif }

Le fichier style.css :

BODY { margin-left: 50px ; color: navy ; background-color: white;

font-family: Arial, Helvetica, sans-serif }

A:link { color: red }

-2-
Chapitre 1 : Feuille de styles 3ème STI
A:active { color: green }

A:visited { color: green }

H1,H2,H3,H4 { text-align: center ; font-family: "Comic Sans MS", sans-serif ;

font-size: large }

H1 { text-align: center ; color: white ; background: navy }

H2,H3,H4 { text-align: left ; color: navy ; background: white }

TH { background: silver }

TH,TD { font-family: Arial, Helvetica, sans-serif }

-3-