« Le langage HTML/Internationalisation » : différence entre les versions

→‎Exemple de feuille de style différenciant la langue : guillemets en clair dans l'exemple complet
(→‎Exemple de feuille de style différenciant la langue : guillemets en clair dans l'exemple complet)
p:lang(en-GB) { quotes: '\2018' '\2019' '\201c' '\201d'; }
p:lang(en-US) { quotes: '\201c' '\201d' '\2018' '\2019'; }
Les guillemets étant des caractères non-ASCII, on les mentionne en CSS après une barre de fraction, en indiquant le code Unicode en hexadécimal (U+00ab est le guillemet ouvrant français « <code>«</code> », U+00a0 est l'espace insécable…). Si on définit la page de code utilisée dans la feuille de style, on peut utiliser des caractères non-ASCII, mais la solution avec les barres de fraction inversée est universelle.
 
Vous pouvez tester le résultat avec des paragraphes suffisamment longs.
 
; Exemple
 
{{vert|&lt;html}} lang="fr" {{vert|&gt;}}
{{vert|&lt;!DOCTYPE}} html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "<nowiki>http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</nowiki>" {{vert|&gt;}}
{{vertbleu|&lt;headhtml}} lang="fr" {{bleu|&gt;}}
{{bleurouge|&lt;stylehead&gt;}}
{{rouge|/*}} ********** Français ********** {{rouge|*/}}
HTML:lang(fr) { quotes: '\00ab\00a0' '\00a0\00bb'; } {{rouge|/*}} guillemets de citation pour tout le document {{rouge|*/}}
p:lang(fr) {
text-align: justify; {{rouge|/*}} texte justifié {{rouge|*/}}
text-indent: 2em; {{rouge|/*}} retrait de paragraphe {{rouge|*/}}
margin-top: 0; {{rouge|/*}} pas de saut de ligne {{rouge|*/}}
margin-bottom: 0;
quotes: '\00ab\00a0' '\00a0\00bb'; {{rouge|/*}} guillemets de citation pour un paragraphe {{rouge|*/}}
}
{{rouge|/*}} ********** Anglais ********** {{rouge|*/}}
HTML:lang(en) { quotes: '\2018' '\2019' '\201c' '\201d'; } {{rouge|/*}} guillemets de citation pour tout le document {{rouge|*/}}
HTML:lang(en-GB) { quotes: '\2018' '\2019' '\201c' '\201d'; } {{rouge|/*}} 2 niveaux de citation {{rouge|*/}}
HTML:lang(en-US) { quotes: '\201c' '\201d' '\2018' '\2019'; } {{rouge|/*}} différents en GB et aux US {{rouge|*/}}
p:lang(en) {
text-align:left; {{rouge|/*}} texte aligné à gauche {{rouge|*/}}
text-indent: 0; {{rouge|/*}} pas de retrait de paragraphe {{rouge|*/}}
margin-top: 1em;
margin-bottom: 1em; {{rouge|/*}} saut de ligne {{rouge|*/}}
quotes: '\2018' '\2019' '\201c' '\201d' {{rouge|/*}} guillemets de citation pour un paragraphe {{rouge|*/}}
}
p:lang(en-GB) { quotes: '\2018' '\2019' '\201c' '\201d'; }
p:lang(en-US) { quotes: '\201c' '\201d' '\2018' '\2019'; }
{{bleu|&lt;/style&gt;}}
{{vert|&lt;/head&gt;meta}}
http-equiv="Content-Type"
content="text/html; charset=ISO-8859-15" {{vert|/&gt;}}
{{vert|&lt;bodystyle&gt;}}
{{rouge|/*}} ********** Français ********** {{rouge|*/}}
HTML:lang(fr) { quotes: '\00ab«\00a0' '\00a0\00bb»'; } {{rouge|/*}} guillemets de citation pour tout le document {{rouge|*/}}
p:lang(enfr) {
text-align: justify; {{rouge|/*}} texte justifié {{rouge|*/}}
text-indent: 2em; {{rouge|/*}} retrait de paragraphe {{rouge|*/}}
margin-top: 0; {{rouge|/*}} pas de saut de ligne {{rouge|*/}}
margin-bottom: 0;
quotes: '\00ab«\00a0' '\00a0\00bb»'; {{rouge|/*}} guillemets de citation pour un paragraphe {{rouge|*/}}
}
{{rouge|/*}} ********** Anglais ********** {{rouge|*/}}
HTML:lang(en) { quotes: '\2018' '\2019' '\201c' '\201d'; } {{rouge|/*}} guillemets de citation pour tout le document {{rouge|*/}}
HTML:lang(en-GB) { quotes: '\2018' '\2019' '\201c' '\201d'; } {{rouge|/*}} 2 niveaux de citation {{rouge|*/}}
HTML:lang(en-US) { quotes: '\201c' '\201d' '\2018' '\2019'; } {{rouge|/*}} différents en GB et aux US {{rouge|*/}}
p:lang(fren) {
text-align:left; {{rouge|/*}} texte aligné à gauche {{rouge|*/}}
text-indent: 0; {{rouge|/*}} pas de retrait de paragraphe {{rouge|*/}}
margin-top: 1em;
margin-bottom: 1em; {{rouge|/*}} saut de ligne {{rouge|*/}}
quotes: '\2018' '\2019' '\201c' '\201d' {{rouge|/*}} guillemets de citation pour un paragraphe {{rouge|*/}}
}
p:lang(en-GB) { quotes: '\2018' '\2019' '\201c' '\201d'; }
p:lang(en-US) { quotes: '\201c' '\201d' '\2018' '\2019'; }
{{bleuvert|&lt;/style&gt;}}
{{rouge|&lt;/head&gt;}}
{{rouge|&lt;body&gt;}}
{{vert|&lt;p}} lang="fr"{{vert|&gt;}}
{{vert|&lt;/p&gt;}}
{{vertrouge|&lt;/body&gt;}}
{{vertbleu|&lt;/html&gt;}}
 
----
; Note
: Comme on a défini la page de code dans l'en-tête du fichier HTML, on peut utiliser les guillemets « en clair » (caractères non-ASCII) dans la feuille de style intégrée.
----
 
{{loupe|Programmation CSS/Les sélecteurs#Autres pseudo-classes}}
13 668

modifications