Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.
La propriété ruby-position définit la position d'un élément ruby par rapport à son élément de base. L'élément ruby peut ainsi être positionné au-dessus de l'élément (over), en-dessous (under) ou entre les caractères, sur leur droite (inter-character).
| Valeur initiale | over |
|---|---|
| Applicabilité | annotations ruby des conteneurs |
| Héritée | oui |
| Média | visuel |
| Valeur calculée | comme spécifié |
| Animation type | discrete |
| Ordre canonique | l'ordre unique et non-ambigu défini par la grammaire formelle |
Syntaxe
/* Valeurs avec un mot-clé */ ruby-position: over; ruby-position: under; ruby-position: inter-character; /* Valeurs globales */ ruby-position: inherit; ruby-position: initial; ruby-position: unset;
Valeurs
over- Un mot-clé qui indique que les annotations ruby doivent être placée au-dessus du texte pour les scripts horizontaux et à droite pour les scripts verticaux.
under- Un mot-clé qui indique que les annotations ruby doivent être placés sous le texte pour les scripts horizontaux et à gauche pour les scripts verticaux.
inter-character- Un mot-clé qui indique que les annotations ruby doivent être placées entre les différents caractères.
Syntaxe formelle
over | under | inter-character
Exemples
Ce fragment HTML rendra un résultat différent pour chaque valeur de ruby-position :
<ruby> <rb>超電磁砲</rb> <rp>（</rp><rt>レールガン</rt><rp>）</rp> </ruby>
Au-dessus du texte
ruby {
ruby-position:over;
}
On obtiendra le résultat suivant :
En-dessous du texte
ruby {
ruby-position:under;
}
On obtiendra le résultat suivant :
Spécifications
| Spécification | Statut | Commentaires |
|---|---|---|
| CSS Ruby Layout Module Level 1 La définition de 'ruby-position' dans cette spécification. |
Version de travail | Définition initiale. |
Compatibilité des navigateurs
| Fonctionnalité | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Support simple | Pas de support | 38 (38) | Pas de support[1] | ? | Pas de support[2] |
inter-character |
Pas de support | Pas de support | Pas de support | ? | Pas de support |
| Fonctionnalité | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Support simple | Pas de support | 38.0 (38) | Pas de support[1] | Pas de support | Pas de support[2] |
inter-character |
Pas de support | Pas de support | Pas de support | Pas de support | Pas de support |
[1] Internet Explorer, depuis IE 9, supporte une ancienne version du brouillon de la spécification où inline est défini (équivalent à display: inline pour les éléments) et où above est également défini (synonyme de over)
[2] WebKit implémente une version non-standard, préfixée, de ruby-position, -webkit-ruby-position : celle possède deux propriétés : before et after (les deux sont équivalentes, pour les scripts LTR et RTL à la valeur standard over, utilisée avec ruby-align: start).
Voir aussi
- Les éléments HTML à propos de Ruby :
<ruby>,<rt>,<rp>et<rtc>. - Les propriétés CSS à propos de Ruby :
ruby-align,ruby-merge.