2009-05-04 7 views
27

Necesito convertir <font size="10"> a px.Cómo convertir <font size = "10"> a px?

Ejemplo solamente (no es correcto): <font size="10"> es equivalente a 12px.

¿Hay alguna conversión de fórmula o tabla para convertir <font size="10"> a px?

+4

tamaños técnicamente fuera del rango de 1 a 7 son válidos. – cletus

+0

Gracias cletus por la propina. – marknt15

Respuesta

38
<font size=1>- font size 1</font><br> 
<span style="font-size:0.63em">- font size: 0.63em</span><br> 

<font size=2>- font size 2</font><br> 
<span style="font-size: 0.82em">- font size: 0.82em</span><br> 

<font size=3>- font size 3</font><br> 
<span style="font-size: 1.0em">- font size: 1.0em</span><br> 

<font size=4>- font size 4</font><br> 
<span style="font-size: 1.13em">- font size: 1.13em</span><br> 

<font size=5>- font size 5</font><br> 
<span style="font-size: 1.5em">- font size: 1.5em</span><br> 

<font size=6>- font size 6</font><br> 
<span style="font-size: 2em">- font size: 2em</span><br> 

<font size=7>- font size 7</font><br> 
<span style="font-size: 3em">- font size: 3em</span><br> 
+4

¿De dónde obtuvieron el tamaño de fuente: valores? ¿Cómo se asegura de que sean correctos en todos los navegadores? – pts

+0

@pts, los obtuve mirando la representación del navegador. Depende de la implementación del navegador, por lo que no creo que deba garantizar la corrección para todos los navegadores. Se ve lo suficientemente cerca en todos los navegadores que probé con zoom max. –

+0

Parece ser correcto en Safari y Firefox. – Chuck

1

En general, no puede confiar en un tamaño de píxel fijo para las fuentes, el usuario puede escalar la pantalla y los valores predeterminados no son siempre los mismos (depende de la configuración de PPP de la pantalla, etc.).

Quizás eche un vistazo a this (píxel a punto) y this link.

Pero, por supuesto, puede establecer el tamaño de la fuente en px, para que sepa cuántos píxeles tiene la fuente en realidad. Esto puede ayudar si realmente necesita un diseño fijo, pero esta práctica reduce la accesibilidad de su sitio web.

+0

¡Oh, cómo han cambiado las cosas desde ese enlace de píxel a punto. Hablando de resoluciones de pantalla máxima de 1024x768 .... lol – ClarkeyBoy

0

Esto no puede responderse tan fácilmente. Depende de la fuente utilizada y de los puntos por pulgada (ppi). This debería dar una visión general del problema.

15

Según W3:

Este atributo establece el tamaño de la fuente . Valores posibles:

  • un número entero entre 1 y 7. Esto establece la fuente hasta cierto tamaño fijo, cuya prestación depende del usuario agente. No todos los agentes de usuario pueden mostrar los siete tamaños.
  • Un aumento relativo en el tamaño de fuente. El valor "+1" significa un tamaño más grande. El valor "-3" significa tres tamaños más pequeños. Todos los tamaños pertenecen a la escala de 1 a 7.

Por lo tanto, la conversión que está pidiendo no es posible. No es necesario que el navegador use tamaños específicos con atributos específicos size.

También tenga en cuenta que el uso del elemento font es desaconsejado por W3 a favor de style sheets.

+0

Ya veo, gracias Tormod. Estoy usando la solución de eed3si9n y este convertidor http://pxtoem.com/. Ahora funciona. Gracias a todos ustedes que me respondieron: D – marknt15

5

Usando los puntos de datos de la respuesta aceptada, puede usar la interpolación polinómica para obtener una fórmula.

WolframAlpha Entrada: polinomio de interpolación {{1, .63}, {2, .82}, {3,1}, {4,1.13}, {5,1.5}, {6, 2}, { 7,3}}

Fórmula: 0.00223611x^6 - 0.0530417x^5 + 0.496319x^4 - 2.30479x^3 + 5.51644x^2 - 6.16717x + 3.14

y el uso de código Groovy:

 
import java.math.* 
def convert = {x -> (0.00223611*x**6 - 0.053042*x**5 + 0.49632*x**4 - 2.30479*x**3 + 5.5164*x**2 - 6.167*x + 3.14).setScale(2, RoundingMode.HALF_UP) } 
(1..7).each { i -> println(convert(i)) } 
+0

+1. Genial, pero ¿has considerado que tus entradas no son los puntos de datos reales, sino simplemente números redondeados? – Pacerier

1

Esto es muy viejo, pero <font size="10"> sería de alrededor de <p style= "font-size:55px">

+0

lo siento, "10" es aproximadamente 55px – user2845437

+0

usa palos de retroceso para piezas de código, p. '\' \ '' –

1

el tamaño de fuente a la cartografía em es sólo exacta si no hay una fuente de tamaño definido y cambia cuando su contenedor está configurado en diferentes tamaños.

La siguiente funciona mejor para mí, pero no tiene en cuenta el tamaño = 7 y cualquier cosa por encima de 7 sólo se renderiza como 7.

font size=1 = font-size:x-small 
font size=2 = font-size:small 
font size=3 = font-size:medium 
font size=4 = font-size:large 
font size=5 = font-size:x-large 
font size=6 = font-size:xx-large 

enter image description here

-1

en píxeles
- tamaño de la fuente 1
- tamaño de letra: 0.63em

- tamaño de fuente 2
tamaño de la fuente -: 0.82em

- tamaño de la fuente 3
- tamaño de la fuente: 1.0em

- tamaño de la fuente 4
- tamaño de la fuente: 1.13em

- tamaño de la fuente 5
- tamaño de la fuente: 1.5em

- tamaño de la fuente 6
- tamaño de la fuente: 2em

- tamaño de la fuente 7
- Tamaño de fuente: 3em

éstas son aproximaciones basadas en las mediciones EM

Cuestiones relacionadas