ruby-position
Baseline
2024
*
Newly available
Depuis December 2024, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
Expérimental: Il s'agit d'une technologie expérimentale.
Vérifiez attentivement le tableau de compatibilité des navigateurs avant de l'utiliser en production.
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).
/* 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;
Syntaxe
>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.
Définition formelle
| Valeur initiale | alternate |
|---|---|
| Applicabilité | annotations ruby des conteneurs |
| Héritée | oui |
| Valeur calculée | comme spécifié |
| Type d'animation | discrète |
Syntaxe formelle
ruby-position =
[ alternate || [ 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
| Specification |
|---|
| CSS Ruby Annotation Layout Module Level 1> # rubypos> |
Compatibilité des navigateurs
Chargement…
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.