Propriété CSS Unicode-range
Le descripteur CSS Unicode-range définit l'intervalle spécifique de caractères qui sont utilisés sur la page avec des polices par la propriété @font-face.
Si la page n'utilise aucun caractère de cet intervalle, la police n'est pas téléchargée. Si au moins un caractère est utilisé, toute la police est téléchargée.
Les points Unicode sont précédés par un U+ suivi par jusqu'à six caractères qui créent le code de caractère. Les points ou les intervalles, qui n'ont pas ce format, sont considérés invalides et vont faire être ignoré à l'élément.
Il y a plusieurs options Unicote à utiliser. Basic Latin (0020—007F) est l'intervalle le plus commun pour les sites anglais.
Valeur initiale | U+0-10FFFF |
Appliquée à | La propriété bloc @font-face est comprise à l'intérieur. |
Héritée | Oui. |
Animable | Non. |
Version | CSS3 |
Syntaxe DOM | object.style.unicodeRange = "U+0025-00FF"; |
Syntaxe
unicode-range: single codepoint | codepoint range | wildcard range | initial | inherit;
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
<style>
@font-face {
font-family: 'MyFont'; /* Définit le nom de la police */
src: url('myfont.woff2') format('woff2'),
url('myfont.woff') format('woff'); /* Définit la place où la police est téléchargée*/
unicode-range: U+00-FF; /* Définit les caractères disponibles */
}
div {
font-size: 3em;
font-family: MyFont, Helvetica, sans-serif;
}
</style>
</head>
<body>
<h2>Exemple de la propriété unicode-range</h2>
<div>Marie & Pierre sont des amis.</div>
</body>
</html>
Valeurs
Valeur | Description |
---|---|
single codepoint | Un point de code de caractère Unicode. |
codepoint range | Un intervalle des points de code Unicode. |
wildcard range | Un intervalle des points de code Unicode qui contient des caractères génériques, qui utilisent le caractère '?'. |
initial | Fait utiliser la valeur initiale. |
inherit | Hérite la propriété de son élément parent. |
Support de Navigateurs
✓ | ✓ | 36.0+ | ✓ | ✓ |
Pratiquez vos connaissances
Quel est le rôle de la propriété CSS 'unicode-range'?
Correcte!
Incorrecte!