La hiérarchie des éléments est une bonne base d'analyse, car la plupart des pages web d'un site sont structurées de la même façon. Cela fait partie de l'identité visuelle du site et sert à éviter que les visiteurs ne s'imaginent être déjà partis ailleurs (ce qui est vite arrivé par des clics sur des liens malencontreux).
Dans notre exemple, nous souhaiterions par exemple que les abréviations des titres ne soient pas affectées, ce qui consiste à dire que seuls les abbr placés dans des p doivent être stylés.
La syntaxe CSS de base dans ce cas sera de la forme :
element element { propriété_css : valeur; }Notre HTML a l'avantage de ne pas avoir besoin d'être modifié :
<h1>Utiliser du <abbr>CSS3</abbr> avec du <abbr>HTML5</abbr></h1> <p>Le <abbr>CSS3</abbr> est la variante en cours de recommandation par le <a href=«http://w3.org»> W3C </a>. Elle s'inscrit, par rapport à ses prédécesseurs, dans la même logique de perfectionnement que le <abbr>HTML5</abbr> par rapport au <abbr>HTML4</abbr>.</p> <p>Le CSS apporte de nombreuses améliorations et extensions qui le rendent beaucoup plus universel et utilisables dans de nombreux contextes.</p>
du CSS :
p abbr{color:green; }
pour un rendu :
Le CSS3 est la variante en cours de recommandation par le W3C . Elle s'inscrit, par rapport à ses prédécesseurs, dans la même logique de perfectionnement que le HTML5 par rapport au HTML4.
Le CSS apporte de nombreuses améliorations et extensions qui le rendent beaucoup plus universel et utilisable dans de nombreux contextes.
Dans le cas précédent, toutes les balises abbr incluses dans un p seront prises en compte. Que se passe-t-il alors si nous souhaitons appliquer une balise abbr à W3C dans le lien ou par exemple mise en annotation dans une balise plus générale comme span, et donner un aspect spécifique à celle-ci. Nous pourrons alors utiliser l'imbrication directe exclusive qui ne modifiera que les enfants directement inclus dans la balise et qui ne prendrons pas en compte ceux qui seront placés à l'intérieur d'une balise intermédiaire et redéfinir le style pour les abbr dans les a.
element > element { propriété_css : valeur; }Notre HTML a l'avantage de ne pas avoir besoin d'être modifié :
<h1>Utiliser du <abbr>CSS3</abbr> avec du <abbr>HTML5</abbr></h1> <p>Le <abbr>CSS3</abbr> est la variante en cours de recommandation par le <a href=«http://w3.org»> <abbr>W3C</abbr> </a>. Elle s'inscrit, par rapport à ses prédécesseurs, dans la même logique de perfectionnement que le <abbr>HTML5</abbr> par rapport au <abbr>HTML4</abbr>.</p> <p>Le CSS apporte de nombreuses améliorations et extensions qui le rendent beaucoup plus universel et utilisables dans de nombreux contextes.</p>
du CSS :
p > abbr{color:green; }p > a abbr{color:yellow; }
pour un rendu :
Le CSS3 est la variante en cours de recommandation par le W3C . Elle s'inscrit, par rapport à ses prédécesseurs, dans la même logique de perfectionnement que le HTML5 par rapport au HTML4.
Le CSS apporte de nombreuses améliorations et extensions qui le rendent beaucoup plus universel et utilisable dans de nombreux contextes.
Il y a une erreur de communication avec le serveur Booktype. Nous ne savons pas actuellement où est le problème.
Vous devriez rafraîchir la page.