Norme Unicode pour les symboles de contrôle multimédia
Pause: ⏸︎
La norme Unicode 13.0 (mise à jour 2020) fournit les glyphes techniques divers dans la plage HEX 2300–23FF
Divers technique
Compte tenu de la vaste documentation Unicode 13.0 , certains des glyphes que nous pouvons associer aux symboles de contrôle multimédia courants seraient les suivants:
Symboles du clavier et de l'interface utilisateur
23CF ⏏︎ Éjecter le support
Symboles de l'interface utilisateur
23E9 ⏩︎ avance rapide
23EA ⏪︎ retour rapide, retour rapide
23EB ⏫︎ augmentation rapide
23EC ⏬︎ diminution rapide
23ED ⏭︎ sauter à la fin,
23EE suivant ⏮︎ sauter au début, précédent
23EF ⏯︎ bascule lecture / pause
23F1 ⏱︎ chronomètre
23F2 ⏲︎ horloge
23F3 ⏳︎ sablier
23F4 ⏴ ︎ arrière, arrière
23F5 ⏵︎ avant, suivant, lecture
23F6 ⏶︎ augmenter
23F7 ⏷︎ diminuer
23F8 ⏸︎ pause
23F9 ⏹︎ arrêter
23FA ⏺︎ enregistrer
Symboles de puissance de l'ISO 7000: 2012
23FB ⏻︎ veille / alimentation
23FC ⏼︎ mise sous / hors tension
23FD ⏽︎ mise sous tension
2B58 ⭘︎ mise hors tension
Symbole d'alimentation de IEEE 1621-2004
23FE ⏾︎ veille électrique
Utilisation sur le Web:
Un fichier doit être enregistré à l'aide du codage UTF-8 sans BOM (qui dans la plupart des environnements de développement est défini par défaut) afin d'indiquer à l'analyseur comment transformer correctement les octets en caractères. <meta charset="utf-8"/>doit être utilisé immédiatement après <head>dans un fichier HTML et assurez-vous que les en-têtes HTTP corrects Content-Type: text/html; charset=utf-8sont définis.
Exemples:
HTML
⏩ Pictograph
⏩︎ Standardized Variant
CSS
.icon-ff:before { content: "\23E9" }
.icon-ff--standard:before { content: "\23E9\FE0E" }
JavaScript
EL_iconFF.textContent = "\u23E9";
EL_iconFF_standard.textContent = "\u23E9\uFE0E"
Variante standardisée
Pour éviter un glyphe d'être « couleur emojified » ⏩︎ / ⏩ append le code U + FE0E texte Présentation Selector pour demander une variante normalisée : (exemple: ⏩︎)
Incohérences
Les caractères de la gamme Unicode sont sensibles à l'environnement de famille de polices dans lequel ils sont utilisés, à l'application, au navigateur, au système d'exploitation, à la plate-forme.
Lorsqu'ils sont inconnus ou manquants , nous pourrions voir des symboles comme ou ▯ à la place, ou même un comportement incohérent en raison des différences dans les implémentations de l'analyseur HTML par différents fournisseurs.
Par exemple, sur les navigateurs Windows Chromium, le suffixe de variante standard U + FE0E est bogué, et ces symboles sont toujours mieux accompagnés de CSS, c'est- font-family: "Segoe UI Symbol"à- dire: pour forcer cette police spécifique sur l'Emoji coloré (généralement reconnu comme "Segoe UI Emoji") - ce qui défie le but de U + FE0E en premier lieu - le temps nous le dira…
Polices d'icônes évolutives
Pour contourner les problèmes liés aux caractères non pris en charge , une solution viable consiste à utiliser des jeux de polices d'icônes évolutives comme par exemple:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<i class="fa fa-arrows-alt"></i>
<i class="fa fa-backward"></i>
<i class="fa fa-compress"></i>
<i class="fa fa-eject"></i>
<i class="fa fa-expand"></i>
<i class="fa fa-fast-backward"></i>
<i class="fa fa-fast-forward"></i>
<i class="fa fa-forward"></i>
<i class="fa fa-pause"></i>
<i class="fa fa-play"></i>
<i class="fa fa-play-circle"></i>
<i class="fa fa-play-circle-o"></i>
<i class="fa fa-step-backward"></i>
<i class="fa fa-step-forward"></i>
<i class="fa fa-stop"></i>
<i class="fa fa-youtube-play"></i>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<i class="material-icons">pause</i>
<i class="material-icons">pause_circle_filled</i>
<i class="material-icons">pause_circle_outline</i>
<i class="material-icons">fast_forward</i>
<i class="material-icons">fast_rewind</i>
<i class="material-icons">fiber_manual_record</i>
<i class="material-icons">play_arrow</i>
<i class="material-icons">play_circle_filled</i>
<i class="material-icons">play_circle_outline</i>
<i class="material-icons">skip_next</i>
<i class="material-icons">skip_previous</i>
<i class="material-icons">replay</i>
<i class="material-icons">repeat</i>
<i class="material-icons">stop</i>
<i class="material-icons">loop</i>
<i class="material-icons">mic</i>
<i class="material-icons">volume_up</i>
<i class="material-icons">volume_down</i>
<i class="material-icons">volume_mute</i>
<i class="material-icons">volume_off</i>
et bien d'autres que vous pouvez trouver dans la nature; et last but not least, cet outil en ligne très utile: générateur d'icônes de polices, Icomoon.io .