Scribd
Importer
102 vues

Lycée Aïn Draham Html5 Css3 Chedi Zaghdoudi: Classe: 3SI Matière: STI

Le document décrit les étapes pour créer une page web simple avec du HTML et du CSS. Il contient 8 instructions pour structurer la page web avec du HTML, puis appliquer du style avec des règles CSS.

Transféré par

Abdelkabir Outanast
Copyright
© © All Rights Reserved
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
102 vues

Lycée Aïn Draham Html5 Css3 Chedi Zaghdoudi: Classe: 3SI Matière: STI

Le document décrit les étapes pour créer une page web simple avec du HTML et du CSS. Il contient 8 instructions pour structurer la page web avec du HTML, puis appliquer du style avec des règles CSS.

Transféré par

Abdelkabir Outanast
Copyright
© © All Rights Reserved
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
Vous êtes sur la page 1/ 2

Lycée Aïn Draham HTML5 CSS3 Chedi Zaghdoudi

1. Lancer l’éditeur Sublime Text et écrire le code HTML correspondant à la page


web représentée dans la figure 1 suivante :

Figure 1: la page TP1.html

2. Enregistrer votre travail dans un fichier ayant pour nom TP1.html et pour
emplacement votre dossier de travail.
3. Créer un fichier externe style01.css dans votre dossier de travail contenant
le code suivant :

Figure 2: une règle CSS

Classe : 3SI Matière : STI


1
Lycée Aïn Draham HTML5 CSS3 Chedi Zaghdoudi

4. Mettre l’arrière-plan du titre de niveau 1 en couleur ayant le code suivant


#FFC300 et encadrer-le avec une bordure solide de couleur noir de taille 2px.
5. Mettre la première section uniquement en couleur de fond ayant le code
#DAF7A6 et encadrer-la avec une bordure solide de couleur orange et de
taille 3px.
6. Mettre les deux premiers paragraphes de la première section en couleur
d’arrière-plan LightSalmon et colorer le texte en noir, de taille 20px et de
style italique.
7. Appliquer aux deux derniers paragraphe de la deuxième section les règle CSS
suivantes :
• Pour le premier paragraphe de la deuxième section identifié par col1 :

Figure 3: Règles css pour le 1er paragraphe

• Pour le deuxième paragraphe de la deuxième section identifié par col2 :

Figure 4: règles css pour le 2eme paragraphe

8. Appliquer la mise en forme correspondante à la section 3 pour qu’elle puisse


apparaître comme la figure 5 suivante :

Figure 5: Mise en forme de la section 3

Classe : 3SI Matière : STI


2

Vous aimerez peut-être aussi