Essai pour un examen CSS ,

**iMech** · 03/12/2015, 21h52

bonsoir;
j'aime bien avoir vos avis pour mon travail , me corrigé les erreurs
surtout pour les dernières questions

voila la page HTML brute

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html >
<head>
<title> Fichier utilisé pour déterminer l’arbre (ou arborescence) d’un document HTML
</title>
</head>
<body>
<div class=’content’>
<h1> Un titre <strong> de niveau 1 </strong> </h1>
<p> Il est vraiment très important <strong> en
<a href="http://fr.wikipedia.org/wiki/html"> HTML </a>
</strong> d’être capable de dessiner l’arbre ou arborescence d’un document
XHTML. Cela permet : </p>
<ul id=’lista’>
<li> de mieux comprendre le document que l’on crée </li>
<li> aux programmes de modifier le document (hors de ce cours) </li>
<li> d’utiliser correctement les
<a href="http://fr.wikipedia.org/wiki/CSS"> <strong> CSS </strong> </a> </li>
</ul>
<p> Il faut être capable de donner, pour chaque balise : </p>
<ul id=’listeit’>
<li><a href=’’> ses descendants </a></li>
<li><a href=’’>  ses ascendants </a> </li>
<li><a href=’’> ses fils </a></li>
<li> <a href=’’> son père </a></li>
</ul></div> </body></html>

maintenant voilà l'énoncé

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
Modifier le document HTML grâce au fichier style.css qui permet d’ajouter les modifications suivantes :
a)	Ajouter une couleur de fond (gris par exemple (#777) 
b)	    La largeur est 1000 px il doit être centré
c)	    Le style d’écriture doit être Arial, taille 12px, couleur noir, 
d)	Mettre les titres de niveau 1 en rouge, gras, souligné et en italique, retrait         gaude de 20px ;
e)	Justifier les paragraphes avec un retrait de la première ligne de 15px
f)	Supprimer les puces dans les listes non ordonnées
g)	Mettre les items des listes  en gras, vert et souligner
h)	Modifier la couleur des liens en vert
i)	les textes mis en valeur grâce à la balise <STRONG> sont affichés en rouge
j)	les textes dans les listes (ordonnées ou non ordonnées) mis en valeur grâce à la balise <STRONG> sont affichés en italique, en gras et en bleu (les autres restant affichés en rouge)
k)	   Mettre les items des listes dont l’identifiant  listeit  alignées dans l’espacement avant 10px  et après 5px, hauteur 20px  et le couleur du fond rose (#F39)
l)	Le style des liens dans les items des listes dans l identifient listeit sont avec un ombre de 1px, en gras, couleur blanc et n’est pas souligner 
m)	L’espace entre les items des listes et la balise qui la précède doit être 20px

enfin voilà ma feuille de style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
@charset "utf-8";
/* CSS Document */
 
 
body{
	background-color: #777;
	margin-left: auto;
    margin-right: auto;
	width: 1000px;
	}
 
.content{
 
    font-family:"Arial";
	font-size: 12px;
	color: black;
}
.content h1{
	color:red;
	margin-left: 20px;
	font-style: italic;
	font-weight: bold;
	text-decoration: underline;
 
}
.content p{
	text-indent: 15px;
 
}
#lista {
	list-style: none;
 
}
ul{
	font-weight:bold;
	color:#390;
	text-decoration:underline;
}
a{
	color:#0F6;
}
 
.content strong {
	color: red;
}
.content ul strong {
	font-style:italic;
	font-weight:bold;
	color:#00F;
}
#listeit{
    padding: 20px 5px 10px;
	background-color:#F39;
 
}
#listeit, a {
	text-shadow: 1px white; 
	font-weight:bold;
	font-style:normal;
	text-decoration:none;
 
}

j'ai mis en gras les questions ou je doute avoir bien répondu

merci

Invité · 05/12/2015, 11h53

Bonjour,

Le style des liens dans les items des listes dans l identifient listeit sont avec un ombre de 1px, en gras, couleur blanc et n’est pas souligner

Ce qui est sûr, c'est que ce n'est pas un examen d'orthographe...

Quant aux réponses, voir dans :

**CCyrillus** · 05/12/2015, 15h31

Bonjour,

Si tu est débutant, la bonne idée serait de reprendre chaque question et de trouver le sélecteur adéquat dans un premier temps afin de te familiariser avec ceux-ci en abordant la structure HTML dans sa globalité et par zones/groupes.

Une fois que tu as bien identifié ta structure et les sélecteurs qu'il te faut pour cibler telle ou telle partie, tu peut sereinement t'attaquer au CSS.

Tu peut te servir d'un outil tel que codepen http://codepen.io/anon/pen/Ywzvzy sur lequel tu auras en live tes ajouts/modifications. L'intérêt pour de petite page est qu'il te suffit d'ouvrir une page dans un navigateur et que tu vois aussitôt les effets des règles que tu appliques (un dessin est souvent plus rapide et efficace qu'une longue explication avec des termes qui te sont encore peu ou pas familier).

Sinon, c'est quoi ce prof ? un tuto en ligne copier/coller passé au traducteur et au shaker ?

Essai pour un examen CSS ,

CSS

Discussions similaires

Partager

Partager