SELFHTML/Quickbar
Feuilles de style CSS
Mentions de feuilles de style
Ce que sont les pseudo-formats a été décrit dans la partie définir
les pseudo-formats.
![]() ![]() |
Vous pouvez spécifier l'apparence de liens à des pages non encore visitées, à des pages déjà visitées et à de liens qui viennent d'être cliqués.
<style type="text/css"> a:link { color:#FF0000; font-weight:bold } a:visited { color:#990000; } a:active { color:#0000FF; font-style:italic } </style> |
Notez d'abord le repère HTML auquel les mentions pseudo doivent s'appliquer.
Dans l'exemple ci-dessus, c'est le repère <a> qui est
habituellement employé en HTML pour les liens. Ces données sont également appropriées pour des éléments qui reçoivent
le caractère de lien par
HTML
dynamique. Derrière le nom du repère HTML est placé un double
point suivi d'un nom pour le pseudo-élément désiré. Pour cela, les mentons
suivantes sont permises.
link = pour des liens à des pages non encore visitées
visited = pour des liens à des pages déjà visitées
active = pour des liens en train d'être cliqués
Derrière, vous pouvez définir comme d'habitude entre parenthèses accolade les propriétés pour de tels éléments. À cette fin sont permises les mentions
de couleur pour la couleur du lien. Même d'autres mentions par exemple
sur l'
arrière
plan du passage du lien pouvant être cliqué sont possibles.
Netscape 4.0 et l'Explorer Internet 3.0 MS n'interprètent que les mentions sur la couleur mais pas celles sur le formatage de police. Netscape 4.0 n'interprète pas non plus le pseudo-format a:active.
![]() ![]() |
Pour les paragraphes qui comportent un texte plus long, vous pouvez imposer une apparence différente pour la première ligne du paragraphe. C'est un effet typographique bien connu dans l'imprimerie.
<style type="text/css"> p:first-line { font-weight:bold } h1:first-line { color:#990000; } </style> |
Notez d'abord le repère HTML auquel doivent s'appliquer les mentions pseudo.
Dans l'exemple ci-dessus, il s'agit des repères HTML <p>
et <h1>. Derrière le nom du repère suit un double point suivi
lui-même de la mention du pseudo-élément :first-line. Derrière, vous pouvez définir comme d'habitude entre
parenthèses accolade les propriétés pour de tels éléments. Pour ce faire sont permises toutes les
possibilités de formatage appropriées, par exemple des mentions sur le formatage
de police ou des mentions sur l'
arrière
plan.
Ni Netscape 4.0 ni l' Explorer Internet MS, même la version 4.0, n'interprètent encore ces mentions.
![]() ![]() |
Pour les paragraphes qui comportent un texte plus long, vous pouvez imposer une apparence différente pour la première lettre du paragraphe. C'est un effet typographique bien connu dans l'imprimerie.
<style type="text/css"> blockquote.goethe:first-letter { font-size:36pt; color:blue; } blockquote.schiller:first-letter { font-size:36pt; color:green; } </style> |
Notez d'abord le repère HTML auquel doivent s'appliquer les mentions pseudo.
Dans l'exemple ci-dessus ce sont les classes "goethe" et "schiller"
du repère HTML <blockquote>. Suit un double point et enfin la
mention de l'élément pseudo :first-letter. Derrière, vous pouvez définir comme d'habitude entre
parenthèses accolade les propriétés pour de tels éléments. Pour ce faire sont permises toutes les
possibilités de formatage appropriées, par exemple des mentions sur le formatage
de police ou des mentions sur l'
arrière
plan.
Vous pouvez d'après CSS 2.0 noter derrière la mention content:,
non seulement un texte fixe prédéfini, mais aussi des contenus variables et
spéciaux. De cette façon par exemple, il est possible de numéroter les
paragraphes. Les commandes correspondantes n'ont été connues qu'après la
rédaction de ce chapitre et ne sont pas encore décrites ici pour cette raison.
La documentation originale de ces commandes très importantes à l'avenir
peuvent être consultées dans la spécification CSS-2.0 sous le titre Generated content and automatic numbering.
Ni Netscape 4.0 ni l' Explorer Internet MS, même la version 4.0, n'interprètent encore ces mentions.
![]() ![]() |
Vous pouvez spécifier qu'avant ou après un élément, un texte soit inséré.
<style type="text/css"> p.remarque:before { content:"remarque: " } p.vieilli:after { content:" (n'est plus actuel)" } </style> |
Notez d'abord le repère HTML auquel doivent s'appliquer les mentions pseudo. Dans l'exemple ci-dessus, ce sont les classes "remarque" et "vieilli" du repère HTML <p>. Suit un double point et enfin la mention de l'élément pseudo :before, si le texte doit être inséré avant l'élément ou :after, si le texte doit être inséré après l'élément. Derrière, vous pouvez définir comme d'habitude entre parenthèses accolade la mention content:, suivie du texte que vous voulez insérer avant ou après l'élément. Le texte doit figurer entre guillemets. Le texte adopte automatiquement toutes les définitions de format de l'élément concerné. Dans les parenthèses accolades vous pouvez noter d'autres mentions de feuilles de style qui doivent s'appliquer à l'élément.
Vous pouvez d'après CSS 2.0 noter derrière la mention content:,
non seulement un texte fixe prédéfini, mais aussi des contenus variables et
standard. De cette façon par exemple, il est possible de numéroter les
paragraphes. Les commandes correspondantes n'ont été connues qu'après la
rédaction de ce chapitre et ne sont pas encore décrites ici pour cette raison.
La documentation originale de ces commandes très importantes à l'avenir
peuvent être consultées dans la spécification CSS-2.0 sous le titre Generated content and automatic numbering.
Ni Netscape 4.0 ni l' Explorer Internet MS, même la version 4.0, n'interprètent encore ces mentions.
![]() | |
après:![]() |
![]() |
avant:![]() |
![]() |
SELFHTML/Quickbar
Feuilles de style CSS
Mentions de feuilles de style
Serge François, 13405@free.fr