Bonjour,
J'ai mal à comprendre pourquoi ma première cellule du tableau (A1) s'affiche en firebrick.
En fait, si on calcule la specificité des différentes règles:
R0 a une spécificité égale à 0
R15 a une specificité de 3
Ce qui est bizarre encore que le Mot Hello et le mot Total 2 (se trouvant juste après le Tableau, les mêmes règles s'appliquent (R0 et R15) mais ils n'ont pas la même couleur !!!
Je suis vraiment perdu avec ce CSS.
Selon les règles de priorité de style R15 doit dominer normalement. Mais ici, je trouve que chrome et edge font de la sorte que R0 domine.
Pouvez vous m'aider à comprendre ce fait.
Modifié par mohamed_bn (06 Apr 2017 - 16:34)
J'ai mal à comprendre pourquoi ma première cellule du tableau (A1) s'affiche en firebrick.
En fait, si on calcule la specificité des différentes règles:
R0 a une spécificité égale à 0
R15 a une specificité de 3
Ce qui est bizarre encore que le Mot Hello et le mot Total 2 (se trouvant juste après le Tableau, les mêmes règles s'appliquent (R0 et R15) mais ils n'ont pas la même couleur !!!
Je suis vraiment perdu avec ce CSS.
Selon les règles de priorité de style R15 doit dominer normalement. Mais ici, je trouve que chrome et edge font de la sorte que R0 domine.
Pouvez vous m'aider à comprendre ce fait.
<html>
<head>
<style type="text/css">
<!--
table.green {border: 0.2em solid green;}
table {border: 0.2em dashed red;}
html>table {border: 0.2em solid orange;}
td#Type1{border: 0.2em dashed grey;}
td.Type1{border: 0.2em dotted yellow;}
td{border: 0.2em solid aqua;}
*{color: firebrick;} /*R0:.............*/
[lang="ab"]{color: blue;} /*R1:.............*/
[lang="ar"]{color: orange;} /*R2:.............*/
[lang^="a"]{color: aqua !important;} /*R3:.............*/
[lang*="arabic"]{color: yellow;} /*R4:.............*/
[lang$="a"]{color: brown;} /*R5:.............*/
html body table [lang$="r"]{color: purple;} /*R6:.............*/
table>[lang$="r"]{color: skyblue;} /*R7:.............*/
body table [lang$="r"]{color: coral;} /*R8:.............*/
#Type1{ color: bisque;} /*R9:.............*/
.a2{color: magenta;} /*R10:.............*/
.Type1 .a2{color: palegreen;} /*R11:.............*/
.Type1 #Type1{ color: azure;} /*R12:.............*/
#Type1{ color: bisque;} /*R13:.............*/
html head body #Type1{ color: darkgray;} /*R14:.............*/
html>head+body { color: sandybrown;} /*R15:.............*/
body #Type1{ color: fuchsia;} /*R16:.............*/
body>#Type1{ color: darkcyan;} /*R17:.............*/
html>div.Type1{ color: salmon;} /*R18:.............*/
-->
</style>
</head>
<body>
<table>
<tr id="L1">
<td class="Type1">A1</td>
<td class="Type1 a2">A2</td>
<td id="L1" class="Type2">A3</td>
</tr>
</table>
<div class="Type1">Total2</div>
Hello
</body>
</html>
Modifié par mohamed_bn (06 Apr 2017 - 16:34)