Discussion :

[ner0lph]

Bonjour,

Je souhaiterais appliquer des règles CSS à des éléments <h2/>, sauf un. Je ne peux pas changer le code de la page, juste la CSS (sinon, c'est le gros bord**).
En fait, je veux mettre de la numérotation automatique sur mes éléments <h3/> en fonction du nombre d'éléments <h2/> (genre "3.1 Blablabla" : 3 est le numéro du <h2/>, 1 celui du <h3/>). Mais <h2 id="pagetitle"/> est compté dedans alors que je ne le veux pas. Le code (X)HTML vient de DokuWiki.

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
26
 
<div id="main">
  <h2 id="pagetitle">[[<a href="http://www.net">accueil</a>]]</h2>
 
  <h1><a name="Titre" id="Titre">Titre</a></h1>
  <div class="level1">
    <p>blabla</p>
  </div>
 
  <h2><a name="Section" id="Section">Section</a></h2>
  <div class="level2">
    <p>blabla</p>
  </div>
 
  <h3><a name="SousSection" id="SousSection">Sous-Section</a></h3>
  <div class="level3">
     <p>blabla</p>
  </div>
 
  <h3><a name="SousSection" id="SousSection">Sous-Section</a></h3>
  <div class="level3">
     <p>blabla</p>
  </div>
 
  <div id="pageinfo">[...]</div> 
</div>

Code CSS :

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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
 
/* Les niveaux de titres **************************************************************/
body {
	font-family	: "Verdana", "Geneva", sans-serif;
	font-size	: 80%;
	line-height	: 1.5em;
	color		: Black;
	/* On initialise tous les compteurs à 0. */
	counter-reset	: titrepage section soussection soussoussection paragraphe sousparagraphe;
}
 
/* Styles communs de base. */
div#main h2, div#main h3, div#main h4, div#main h5, div#main h6
{
	margin-top		: 2em;
	margin-right-value	: 0pt;
	margin-bottom		: 1em;
	margin-left		: 0pt;
	color			: rgb(152, 1, 1);
}
 
/* h1 */
 
div#main h1 {
	line-height	: 1.6em;
	margin-bottom	: 30px;
	font-size	: 2em;
	color		: #816647;
	margin-top	: 5px;
}
 
/* h2 */
 
div#main h2 {
	/* On incrémente de 1 le compteur "section". */
	counter-increment	: section;
	/* On remet le compteur "soussection" à 0. */
	counter-reset		: soussection;
}
 
div#main h2:before {
 
}
 
/* h3 */
 
div#main h3 {
	border-bottom	: 1px solid rgb(152, 1, 1);
	/* On incrémente de 1 le compteur "soussection". */
	counter-increment	: soussection;
	/* On remet le compteur "soussection" à 0. */
	counter-reset	: soussoussection paragraphe sousparagraphe;
}
 
div#main h3:before {
	/* On met le contenu sous la forme "1  ".*/
	content			: counter(section) "." counter(soussection) "  ";
 
}
 
/* h4 */
 
div#main h4 {
	border-bottom	: 1px dashed rgb(152, 1, 1);
	font-size	: 1em;	
 
	/* On remet les compteurs "paragraphe" à 0. */
	counter-reset	: paragraphe sousparagraphe;
	/* On incrémente de 1 le compteur "soussoussection". */
	counter-increment	: soussoussection;
}
 
div#main h4:before {
	/* On met le contenu sous la forme "1.1  ".*/
	content			: counter(section) "." counter(soussection) "." counter(soussoussection) "  ";
 
 
}
 
/* h5 */
 
div#main h5 {
	color		: Black;
	font-size	: 1em;
	text-indent	: 1em;
	/* On incrémente de 1 le compteur "paragraphe". */
	counter-increment	: paragraphe;
	/* On remet le compteur "paragraphe" à 0. */
	counter-reset	: sousparagraphe;
 
}
 
div#main h5:before {
	/* On met le contenu sous la forme "a)  ".*/
	content			: counter(paragraphe, lower-latin) ")  ";
 
}
 
/* h6 */
 
div#main h6 {
	text-indent	: 2em;
	font-size	: .95em;
	font-weight	: normal;
	/* On incrémente de 1 le compteur "sousparagraphe". */
	counter-increment	: sousparagraphe;}
 
div#main h6:before {
	/* On met le contenu sous la forme "(i)  ".*/
	content			: "(" counter(sousparagraphe,lower-roman) ")  ";
 
}
 
/* Fin. */

Merci par avance si quelqu'un trouve une solution.

[Linaa]

Je souhaiterais appliquer des règles CSS à des éléments <h2/>, sauf un.

Il faudrait au moins que ton élément h2 ait un identifiant pour appliquer un style particulier à celui-ci

[Korko Fain]

Code :

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

1
2
3
4
5
6
7
8
9
10
11
div#main h2 {
    /* On incrémente de 1 le compteur "section". */
    counter-increment    : section;
    /* On remet le compteur "soussection" à 0. */
    counter-reset        : soussection;
}
 
div#main h2#pagetitle {
    counter-increment : none;
    counter-reset: none;
}

[ner0lph]

Mais oui bien sûr !
La valeur « none », je n'y avait même pas pensé ! En fait, ça ne m'était même pas venu à l'esprit... Bravo

Et merci encore !

C'est génial ! Ouah, pardon, Woaw®™, super ! J'suis trop content,

Au fait, comment tu en as eu l'idée ?

[Korko Fain]

Question d'habitude je pense ^^