Comment puis-je déterminer ce que la police utilise en fait un navigateur pour restituer du texte ?

Question

Mon css spécifie "font-family: helvetica, arial, sans-serif;" pour l'ensemble de la page. Il ressemble Verdana est utilisé à la place sur certaines parties. Je voudrais être en mesure de vérifier cela.

J'ai essayé de copier et coller à partir de mon navigateur dans Word, mais ce n'est pas la préservation de la police.

Est-il possible de déterminer la police qui est en fait utilisée pour une section de texte?

Firebug me donnera la liste des polices comme ci-dessus[1], mais je ne vois pas un moyen de déterminer qui de l'une des polices de caractères est utilisé.

1. Il s'avère que la liste incorrect a été utilisé, ce qui a résolu mon original Verdana problème. Mais je suis toujours curieux de savoir si il existe un moyen d'identifier le rendu réel de la police.

Answer 1

Aujourd'hui, google Chrome et Firefox ont construit des outils pour cela.

Dans Firefox, l'Inspecteur de Page a une des Polices de vue:

Cela permettra également de vous dire si les polices de caractères ont été téléchargés.

La capture ci-dessus montre que plusieurs polices de caractères peuvent être affichés de texte Unicode. Le CSS définit:

font-family: Trebuchet MS, Liberation Sans, DejaVu Sans, sans-serif

Mais ces polices souvent de ne pas inclure de nombreux caractères spéciaux. Comme les Polices vue œuvres par élément HTML, où le texte Unicode dans un élément pourrait en fait utiliser plusieurs polices, il montre plusieurs polices. En cas de doute, il suffit de double-cliquer sur le texte dans le code HTML de volet et de se débarrasser du texte, ça ne vous intéresse pas. Puis, lors de la sélection de l'environnant de l'élément nouveau, vous ne verrez qu'une seule option. Dans ce cas, il vous dira que Firefox utilisés "AppleGothic Régulier" pour le 웃 caractère.

Malheureusement, les navigateurs différents sur la même machine peut utiliser des polices différentes, en raison à la police les types de prises en charge/préféré par un navigateur. Sur un Mac, Safari, par exemple pourraient préférer d'Apple, la Technologie de pointe alors que Firefox prend en charge Microsoft OpenType (ce qui pourrait entraîner des problèmes pour l'arabe après l'installation de Microsoft Office sur un Mac). Ou pour le 웃 personnage dans la capture d'écran ci-dessus, google Chrome sur mon Mac préfère "Apple SD Gothique les Néo" (qui est OpenType PostScript) au lieu de "AppleGothic Régulière" (qui est une police TrueType).

Pour Chrome, faites défiler vers le bas "Calculé" de l'onglet, de voir que:

Pour les navigateurs qui n'ont pas de polices similaires vue, il suffit de copier-coller un fragment du texte dans certains traitement de texte ou un éditeur de Texte Riche, sélectionnez du texte spécifique, et de voir ce qui montre le nom de la place dans certains de police liste déroulante. Sur mon Mac, cela ne fonctionne pas lors d'un collage à partir de Firefox, mais fonctionne bien pour Safari et Chrome:

Answer 2

Par Wilfred Hughes réponse, Firefox prend désormais en charge ce mode natif. Cet article a plus de détails.

Cette réponse original fait référence à la "Police Finder" plugin, mais seulement parce que c'est à partir de 4 ans. Le fait que les anciennes réponses linger comme ça, et la communauté ne peut pas mettre à jour est l'un des rares échecs de Débordement de la Pile.

Answer 3

Firefox 22+ vous indiquera quelle police est actuellement utilisée , sans aucune extension.

Answer 4

WhatFont est une extension Chrome qui vous indiquera précisément quelle police dans la pile des polices est en cours de chargement.

Answer 5

Pour les versions actuelles de Firefox (depuis la v7), un add-on appelé "fontinfo" indique la police utilisée (plutôt que ce que dit la propriété CSS famille de polices), en tenant compte des cas où le navigateur revient à une police différente car la famille de polices demandée n'était pas disponible ou ne prenait pas en charge les caractères utilisés dans le texte.