2009-05-04 4 views
27

Мне нужно преобразовать <font size="10"> в px.Как преобразовать <font size = "10"> в px?

Пример только (неправильный): <font size="10"> эквивалентен 12px.

Есть ли какая-либо формула или преобразование таблицы там, чтобы конвертировать <font size="10"> в px?

+4

размеров Технически вне диапазона от 1 до 7 являются недействительными. – cletus

+0

Спасибо cletus за наконечник. – marknt15

ответ

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

Где вы получили размер шрифта: значения? Как вы убедитесь, что они верны во всех браузерах? – pts

+0

@pts, я получил их, посмотрев на рендеринг браузера. Это зависит от реализации браузера, поэтому я не думаю, что я должен убедиться в правильности для всех браузеров. Он выглядит достаточно близко во всех браузерах, на которых я тестировал увеличенный макс. –

+0

Это похоже на Safari и Firefox. – Chuck

1

В общем, вы не можете полагаться на фиксированный размер пикселя для шрифтов, пользователь может масштабировать экран, а значения по умолчанию не всегда одинаковы (зависит от настроек DPI на экране и т. Д.).

Возможно, посмотрите на this (пиксель в точку) и this link.

Но, конечно, вы можете установить размер шрифта на px, чтобы вы знали, сколько пикселей на самом деле является шрифтом. Это может помочь, если вам действительно нужен фиксированный макет, но эта практика снижает доступность вашего веб-сайта.

+0

О, как все переместилось с этой точки в точку. Говоря о максимальных разрешениях экрана 1024x768 .... lol – ClarkeyBoy

0

На это нельзя ответить, что легко. Это зависит от используемого шрифта и точек на дюйм (ppi). This должен дать обзор проблемы.

15

По W3:

Этот атрибут задает размер шрифта . Возможные значения:

  • Целое число от 1 до 7. Это задает шрифт для некоторого фиксированного размера, которого рендеринг зависит от пользователя агента. Не все пользовательские агенты могут отображать все семь размеров.
  • Относительное увеличение размера шрифта. Значение «+1» означает один размер больше. Значение «-3» означает три размера: меньше. Все размеры относятся к шкале от 1 до 7.

Следовательно, преобразование вы просите не представляется возможным. Браузеру не требуется использовать конкретные размеры с определенными атрибутами size.

Также обратите внимание, что использование элемента font не рекомендуется W3 в пользу style sheets.

+0

Я вижу, спасибо Tormod. Я использую решение eed3si9n и этот конвертер http://pxtoem.com/. Теперь это работает. Спасибо всем, кто мне ответил: D – marknt15

5

Используя точки данных из принятого ответа, вы можете использовать полиномиальную интерполяцию для получения формулы.

WolframAlpha Вход: интерполяционный многочлен {{1, .63}, {2, .82}, {3,1}, {4,1.13}, {5,1.5}, {6, 2}, { 7,3}}

Формула: 0,00223611x^6 - 0.0530417x^5 + 0.496319x^4 - 2.30479x^3 + 5.51644x^2 - 6.16717x + 3.14

И использовать в 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. Круто, но считаете ли вы, что ваши входы не являются фактическими точками данных, а просто округлены номерами? – Pacerier

1

Это действительно старое, но <font size="10"> будет около <p style= "font-size:55px">

+0

извините, «10» составляет около 55px – user2845437

+0

. Используйте обратные выходы для фрагментов кода, например. '\' \ '' –

1

размера шрифта отображения эм только точно, если нет размера шрифта определяется и изменяется, когда ваш контейнер установлен в разные размеры.

Следующая лучше работает для меня, но это не учитывает размер = 7 и все, что выше 7 визуализирует только в 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

в пикселях
- размер шрифта 1
- размер шрифта: 0,63em

- размер шрифта 2
размер шрифта -: 0.82em

- размер шрифта 3
- размер шрифта: 1.0em

- размер шрифта 4
- размер шрифта: 1.13em

- размер шрифта 5
- размер шрифта: 1.5em

- размер шрифта 6
- размер шрифта: 2em

- размер шрифта 7
- размер шрифта: 3em

эти приближения, основанные на измерениях эм