Dois-je utiliser le pt ou px?

px ≠ Pixels

Toutes ces réponses semblent être incorrect. Contrairement à l'intuition, dans le CSS le px n'est pas de pixels. Au moins, pas dans le simple sens physique.

Lire cet article à partir de la W3C, EM, PX, PT, CM, EN..., sur la façon px est "magique" de l'unité inventé pour CSS. Le sens de px varie en fonction du matériel et de la résolution. (Cet article est frais, dernière mise à jour le 2014-10.)

Ma propre façon de penser: 1 px is the size of a thin line intended by a designer to be barely visible.

Pour citer cet article:

L'unité px est la magie de l'unité de CSS. Il n'est pas lié à la police et pas liée à l'absolu unités. L'unité px est définie de façon à être petites mais visibles, et telle que l'horizontale de 1px de large ligne peuvent être affichées avec des arêtes vives (pas d'anti-aliasing). Qu'est-ce que pointus, les petites et visible dépend de l'appareil et de la manière dont il est utilisé: avez-vous plus proche de vos yeux, comme un téléphone mobile, à distance de bras, comme un moniteur d'ordinateur, ou quelque part entre les deux, comme un livre? Le px est donc pas défini comme une constante de longueur, mais comme quelque chose qui dépend du type d'appareil et de son utilisation normale.

Pour avoir une idée de l'apparence d'un px, imaginez un CRT moniteur de l'ordinateur à partir des années 1990: le plus petit point il peut afficher des mesures d'environ 1/100e de pouce (0,25 mm) ou un peu plus. L'unité px a obtenu son nom de ceux qui les pixels de l'écran.

Il existe aujourd'hui des appareils qui pourraient, en principe, d'affichage plus petites sharp points (bien que vous pourriez avoir besoin d'une loupe pour les voir). Mais les documents de la siècle dernier qui a utilisé px en CSS toujours le même aspect quel que soit le périphérique. Imprimantes, en particulier, peuvent afficher des lignes avec beaucoup de petits détails que 1px, mais même sur les imprimantes, un 1px ligne ressemble à peu près la même que sur un écran d'ordinateur. L'évolution des équipements, mais le px a toujours le même aspect visuel.

Que l'article donne quelques conseils sur l'utilisation de pt vs px vs em, pour répondre à cette Question.

Ont un coup d'oeil à cet excellent article au CSS-Tricks:

• px – em – % – pt – mot-clé

Tiré de l'article:

---

pt

La dernière unité de mesure qu'il est possible de déclarer la taille de la police est valeurs en points (pt). Point les valeurs sont uniquement pour l'impression CSS! Un point est une unité de mesure utilisée pour de vrai-vie de l'encre sur du papier de la typographie. 72pts = un pouce. Un pouce = une vraie vie de pouce comme une règle. Pas d'un pouce sur un écran, ce qui est totalement arbitraire basée sur la résolution.

Tout comme la façon dont les pixels sont morts précis sur les moniteurs de police de la taille, les tailles sont morts précis sur le papier. Pour le meilleur de la croix-navigateur et multi-plateforme résultats lors de l'impression des pages, mettre en place un impression de la feuille de style et la taille de toutes les polices avec des tailles de point.

Pour faire bonne mesure, la raison pour laquelle nous n'utilisons pas les tailles de point pour affichage à l'écran (autres que ce soit absurde), c'est que la croix-navigateur les résultats sont radicalement différents:

px

Si vous avez besoin d'un contrôle précis, définir la taille des polices dans les valeurs de pixel (px) est un excellent choix (c'est mon préféré). Sur un écran d'ordinateur, il ne peut pas faire plus précis qu'un seul pixel. Avec dimensionnement des polices de caractères en pixels, vous êtes littéralement dire navigateurs pour rendre les lettres exactement ce nombre de pixels en hauteur:

Windows, Mac, alias, anti-aliasing, inter-navigateurs, n'a pas d'importance, un jeu de polices à 14px sera 14px de haut. Mais ce n'est pas à dire il n'y aura pas toujours un peu de variation. Dans un test rapide ci-dessous, les résultats étaient légèrement plus compatible que avec les mots-clés, mais pas identiques:

En raison de la nature de valeurs de pixel, ils ne sont pas en cascade. Si un élément parent a un 18px de la taille de pixel et l'enfant est 16px, l'enfant sera 16px. Cependant, la police la taille les paramètres peuvent être à l'utilisation en combinaison. Par exemple, si le parent a été mis à 16px et de l'enfant a été mis de plus, l'enfant serait en effet de sortir de plus de la mère. Un test rapide m'a montré ceci:

"Plus" frappé l'16px de la société mère dans 20px, une augmentation de 25%.

Pixels ont obtenu une enveloppe de mal dans le passé pour l'accessibilité et l'utilisabilité des préoccupations. Dans IE 6 et ci-dessous, des polices et des tailles de définir, en pixels, ne peut pas être redimensionnée par l'utilisateur. Cela signifie que nous hip sains jeunes designers pouvez définir le type de 12px et de le lire à l'écran, mais quand les gens un peu plus long dans la dent aller à la bosse de la taille afin qu'ils puissent le lire, ils sont incapables de. C'est vraiment IE 6 de la faute, pas la nôtre, mais nous gots ce que nous gots et nous avons à traiter avec elle.

Paramètre de taille de police en pixels est la plus précise (et je trouve le plus satisfaisant) méthode, mais ne prendre en considération le nombre de visiteurs qui utilisent encore IE 6 sur votre site et de leurs besoins en matière d'accessibilité. Nous sommes à droite sur le bord de saignement de ne pas avoir à se soucier de cette plus.

---

pt est une dérivation (abréviation) de "point" qui, historiquement, a été utilisé dans l'impression des polices de caractères dont la taille a été communément "mesuré" dans les "points" où 1 point est une mesure approximative de 1 /72ème de pouce, et donc un 72 de police serait de 1 pouce de taille.

px est une abréviation pour "pixel" qui est un simple "point" sur un écran ou une imprimante matricielle ou une autre imprimante ou un périphérique qui rend dans un point de la mode plutôt que de vieilles machines à écrire qui a une taille fixe, solide attaquant qui a laissé une empreinte d'un caractère en appuyant sur un ruban, laissant ainsi une image de taille fixe.

Étroitement lié au point sont les termes "majuscules" et "minuscules" qui, historiquement, a eu à faire avec la sélection de l'fixe des caractères typographiques où le "captital" où les personnages placés dans une case (cas) au-dessus de la non-captitalized personnages qui ont lieu dans un encadré ci-dessous, et donc le "bas" de cas.

Il y avait différentes cases (cas) pour les différentes polices typographiques et tailles, mais encore et "supérieur" et "inférieur" cas pour chacun de ceux-ci.

Un autre terme est le "pica", qui est une mesure d'un caractère dans la police, ainsi que pica est de 1/6 de pouce ou 12 unités de mesure (12/72) de mesure.

À proprement parler de la mesure sur les ordinateurs 4.233 mm ou 0.166 en considérant que l'ancien point (Américain) est 1/72.27 de un pouce et le français est 4.512 mm (0.177 in.). Donc ma déclaration de "se rapprocher" concernant les mesures.

En outre, les machines à écrire comme utilisé dans les bureaux, avaient et "Elite" ou un "Pica" taille de la taille était de 10 et 12 caractères par pouce repectivly.

En outre, le "point", avant de normalisation a été basée sur le métal typographes "pied" de la taille, de la taille de la base de l'empreinte d'un caractère, et quelque peu varié en taille.

Noter qu'une faute de frappe, "pied" a été à l'origine d'un défunt imprimantes réel pied. Un typographiques pied contient 72 picas ou 864 points.

Comme en CSS, je préfère utiliser EM plutôt que de px ou pt, gagnant ainsi de l'avantage de la mise à l'échelle sans perte de position relative et de la taille.

EDIT: Juste pour être complet, que vous pouvez penser de EM (em) comme élément de mesure de la hauteur de la police, ainsi cadratin (1 em pour un 12pt police serait à la hauteur de la police et de la 2em serait deux fois la hauteur. Notez que pour une 12px la police, la 2em est de 24 pixels. DONC 10px est généralement 0.63 em d'une police standard, comme "la plupart" des navigateurs de base sur 16px = cadratin (1 em comme un standard de taille de police.