2015-05-10 1 views
1

Каковы значения по умолчанию px, pt для font-size:small?Что такое по умолчанию px, pt для размера шрифта: маленький?

.navigation li a{ 
font-weight:400; 
font-family: "Segoe UI",Segoe,Tahoma,Arial,Verdana,sans-serif; 
text-decoration:none; 
**font-size:small;** 
} 
+0

инструменты для разработчиков браузера, панель стилей, вычисленная вкладка, это говорит 13px. – Stickers

+0

@sdcr: Я думаю, что это случилось, что вы протестировали в браузере с масштабированием 1.2. См. Мой ответ ниже со столом. Я не уверен, каково значение ключевых слов, если они имеют предопределенные значения и 'не меняют'. Я думаю, что смысл ключевых слов является «относительным» для чего-то, чтобы он был хорошо отрегулирован на основе текущего контекста. –

ответ

2

Это зависит от агента пользователя.

Из книги: Pro Css techniques

Ключевые слова обеспечивают относительные размеры шрифтов друг с другом на основе коэффициента масштабирования пользовательского агента. Этот коэффициент масштабирования является некоторой движущей мишенью , так как различные пользовательские агенты могут обеспечивать различные масштабирования факторов. Даже спецификация CSS изменила свою рекомендацию между версиями 1 и 2. (CSS 1 определил коэффициент масштабирования 1,5, увеличившись на и .66, но снизился до более неопределенного значения «между 1.0 и 1.2» в спецификации CSS 2 .)

Из-за этого точные размеры пикселей визуализируемого типа варьируются от к браузеру, если размер указан с использованием абсолютных размеров ключевых слов. Если мы предположим, что размер по умолчанию (средний размер) составляет 16 пикселей (как и большинство настольных браузеров, мы получаем из коробки), мы получаем следующие переводы размеров пикселей для коэффициентов масштабирования 1,5 и 1.2:

enter image description here

2

Jquery ответ - px - 13pxpt - 9.75

alert('px :-' +$('p').css('font-size')) 
 
alert('pt :-' +parseInt($('p').css('font-size'))*3/4)
p{ 
 
    font-size:small; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<p>Text</p>

 Смежные вопросы

  • Нет связанных вопросов^_^