294 votes

Symbole de tique en HTML / XHTML

Nous avons besoin d'afficher une coche (✓ ou ✔) au sein d'un interne de l'application web et l'idéal serait d'éviter d'utiliser une image.

A au travail en commençant par IE 6.0.2900 sur une boîte de XP, idéalement, nous faut-il le cross-browser (IE + récentes versions de FF).

Les éléments suivants s'affichent bien que les boîtes de jeux de navigateur de l'encodage UTF-8 (MÉTA fonctionne très bien, et pas la question). La police par défaut est Times New Roman (peut-être un problème, mais en essayant Lucida Sans Unicode n'aide pas et je n'ai pas ni la police Arial Unicode MS, ni Lucida Grande installé).

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head>
<body>
 &#10003; &#10004;
</body>
</html>

Toute aide appréciée.


Les ouvrages suivants, sous IE 6.0 et IE 7:

<html>
<head>

</head>
<body>
 <span style="font-family: wingdings; font-size: 200%;">&#252;</span>
</body>
</html>

Je vous serais reconnaissant si quelqu'un pouvait vérifier sous FF sur Windows. Je suis assez sûr que ça ne marchera pas sur une zone de Windows.

472voto

John Feminella Points 116878

Je pense que vous utilisez moins bien pris en charge Unicode valeurs, qui ne disposent pas toujours de glyphes pour tous les points de code.
Essayez les caractères suivants:

  • ☐ (0x2610 en Unicode hexadécimal [HTML décimal: &#9744;]): vide (non cochée) case
  • ☑ (0x2611 [HTML décimal: &#9745;]): la version vérifiée de la case précédente
  • ✓ (0x2713 [HTML décimal: &#10003;])
  • ✔ (0x2714 [HTML décimal: &#10004;])

Edit: Il semble y avoir une certaine confusion à propos de la première symbole ici, ☐ / 0x2610. C'est un vide (non cochée) case à cocher, donc si vous voyez une case, c'est la façon dont il est censé le regarder. C'est la contrepartie de ☑ / 0x2611, qui est la version vérifiée.

289voto

Gutza Points 1353

Tout d'abord, vous devez réaliser que vous n'avez pas besoin d'utiliser les entités HTML -- aussi longtemps que votre document HTML de codage est déclarée en tant que UTF-8, vous pouvez simplement copier/coller de ces symboles dans votre fichier/script côté serveur/JavaScript/whatever.

Cela dit, voici la liste exhaustive de tous les caractères UTF-8 / HTML entités liées à ce sujet:

  • ☐ (hex: &#x2610; / déc: &#9744;): boîte de scrutin (vide, c'est la façon dont il est censé être)
  • ☑ (hex: &#x2611; / déc: &#9745;): urne à vérifier
  • ☒ (hex: &#x2612; / déc: &#9746;): urne avec x
  • ✓ (hex: &#x2713; / déc: &#10003;): coche, équivalent à &checkmark; et &check; dans la plupart des navigateurs
  • ✔ (hex: &#x2714; / déc: &#10004;): grosse coche
  • ✗ (hex: &#x2717; / déc: &#10007;): bulletin de vote x
  • ✘ (hex: &#x2718; / déc: &#10008;): lourd bulletin de vote x

La vérification des polices web pour les marques de pointage? Voici un prêt à l'usage de l'échantillon: A☐B☑C☒D✓E✔F✗G✘H -- il suffit de copier/coller dans votre webfont du fournisseur de l'échantillon de la zone de texte et de voir les polices à l'appui de ce que la tique symboles.

17voto

Gumbo Points 279147

L’ordinateur client a besoin d’une police appropriée qui a un glyphe pour ce personnage pour l’afficher. Mais ne Times New Roman. Essayez plutôt Arial Unicode MS ou Lucida Grande :

Cela fonctionne pour moi sur Windows XP dans IE 5.5, IE 6.0, FF 3.0.6.

13voto

Drejc Points 5424

Pourquoi n’utilisez-vous pas l’élément d’entrée de case à cocher HTML en mode lecture seule

Je suppose que cela fonctionnera sur tous les navigateurs.

9voto

Echt Einfach TV Points 1091

J’ai rencontré le même problème et aucune des suggestions a travaillé (Firefox sur Windows XP).

J’ai donc trouvé une possible solution de contournement à l’aide de données d’image pour afficher une petite coche :

Bien sûr, vous pouvez créer votre propre image de coche et utiliser un convertisseur pour l’ajouter comme données : image / gif. J’espère que cela aide.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X