CORRIGE TYPE

Transcription

CORRIGE TYPE
CORRIGE TYPE
I.
Partie Théorique :
1. Ecrire le code d’une page Html qui contient les éléments suivants
 Un titre de page
 Des mots clés
 Un paragraphe
 Un tableau
 Une liste non ordonnée qui contient deux éléments
6p
<html>
<head>
<title></title>
<meta name= keywords contenent= />
</head>
<body>
<p></p>
<table>
<tr><td></td></tr>
</table>
<ul><li></li><li></li></ul>
</body>
</html>
2. Soit la déclaration suivante en feuille de style
body {
background:url(../images/page_bg.jpg);
font-family:Arial, Helvetica, sans-serif;
line-height:140%;
color:#000;
font-size:14px;
}
a.
2p
12p
Quelle est le type de cette déclaration et combien de fois on peut l’appeler
Selecteur appelé une fois
b.
Expliqué chaque ligne de code
10p
Image en arriere plan page_bg
Type de police Arial si non Helvetica si non par
défault
Interligne 140%
Couleur noir du texte
1/5
La taille du texte 14px
3. Donner 5 mots clés utiles pour un site web dans un domaine de votre choix 2p
Domaine Sport
Mots clés match liga kacm botola ligue rencontre
football
II- Partie Pratique : (20/20)
P{font :comic sans ms ;
Text-align :center ;
Font-weight :bold ;
Positionabsolute ;
Border : solid 1px ;
Height : auto ;}
2. Identifiant « entete » (largeur 960 px, hauteur 100px, image en arrière-plan ‘tof.jpg’
avec une répétition horizontale)
(2P)
#entete{width :960px ;
Height :100px ;
background:url(../images/tof.jpg);
background-repeat :repeat-x ;}
3. Identifiant « pieds » (largeur 960 px, hauteur 75px, couleur bleu transparente en
arrière-plan, taille de texte 12, évite l’empâtement)
(1,5P)
#pieds{width :960px ;
Height :75px ;
Background-color:bleu transparent;
Font-size :12 ;
Clear :both ;}
4. Classe« menu » (largeur 960 px, hauteur 50px)
(0,5P)
.menu{width :960px ;
Height :50px ;}
5. .menu ul li (affichage horizontale des lignes, bordure double 2px, marge à gauche et
à droite de 30 px)
(2P)
.menu ul li{display :inline ;
Border double 2px ;
Margin : auto 30px auto 30px ;
}
6. Classe « menugauche » (largeur 200 px, hauteur 600 px, position à gauche de la
division suivante)
(1P)
.menugauche{width :200px ;
Height :600px ;
Float :left ;
}
2/5
7. Classe contenu (largeur 760 px, hauteur 600 px)
(0 ,5P)
.contenu{width :760px ;
Height :600px ;
}
B. Ecrire le code d’une page html nommé « exam.html » qui contient les
éléments suivants :
1. Ecrire le titre de la page « mon examen ponctuel + nom et prénom»
(0 ,5P)
2. attaché la feuille de style « styleexam.css » à cette page
(1P)
3. déclarer 5division dans le corps de la pages qui permettent d’appeler l’identifiant
entête, les classes menu , menugauche et contenu et L’identifiant pieds
(2P)
4. dans la division de menu déclarer une liste qui contient les éléments suivants Index,
Filières, Galerie, Contact sachant que (chaque élément comporte un lien vers une page de
même nom)
(2P)
5. dans le menu gauche ajouter une image « pub.jpg »
(1P)
6. dans le contenu vous insérez texte EXAMEN clignote
(1P)
7. le tableau suivant
(2P)
A
D
E
8. écrivez le texte « j’ai terminé mon examen » dans un paragraphe
<html>
<head>
<title>nom &prenom</title>
<link rel=stylesheet type=text/css
href=styleexam.css/>
</head>
<body>
<div id=entete></div>
<div class=menu>
<ul>
<li><a href=index.html>index</a></li>
<li><a href=filieres.html>filieres</a></li>
<li><a href=galerie.html>galerie</a></li>
<li><a href=contact.html>contact</a></li>
</ul>
</div>
<div class=menugauche>
<img src=pub.jpg />
</div>
<div class=contenu>
<blink>examen</blink>
<table
border=1px>
<tr>
<td colspan=2>A</td>
</tr>
3/5
(1P)
<tr>
<td>D</td>
<td>E</td>
</tr>
</table>
<p>j’ai terminé mon examen</p>
</div>
<div id=entete></div>
</body>
</html>
4/5

Documents pareils