Я изучаю CSS и читаю вопросы о размерах шрифта Relative vs Absolute на StackOverflow. Я наткнулся на два потока.
1. В одном потоке (Размер шрифта CSS: относительные или абсолютные значения. Что использовать?), один из ответов на самом деле является вопросом, на который не был дан ответ: [ QUOTE]
Вопрос, многие здесь говорят, что Pt предназначены только для печати. Но разве не приятно иметь простой способ сделать текст размером, который вы хотите быстро, не помня, что у DIV есть значение Em или%. Например, когда у вас есть:
<body>
<div id="box1">
test text sample1
<div id="box2">
test text sample2
<div id="box3">
test text sample3
<div id="box4">
test text sample4
</div>
</div>
</div>
</div>
Я знаю, что это своего рода странная структура, но скажем, что макет требует такой структуры для графических целей и слоев изображения CSS. Поэтому я хотел бы сделать box1 font = 100%, box2 = 1.2em. box3 =.8em и box4 = 1.6em
Теперь проблема заключается в том, что Em из коробки 1 также передается всем своим дочерним элементам, исправьте меня, если я ошибаюсь, поэтому это означает, что box2 не является точно 1,2em, и к тому времени, когда мы получим размер шрифта 4 это действительно сложно сказать, что это такое. Если мы используем Pt или Px, он остается таким, каким мы хотим, чтобы он оставался.
Однако размеры Px являются негибкими, и мне нравится делать шрифты больше в моем меню браузера, когда я сижу далеко от экрана. Позвольте ему взглянуть, это удобно. Таким образом, размер Px отсутствует. Так почему бы не использовать Pt? Насколько велика разница в браузере?
2. Другая тема имеет тот же вопрос (Сопоставляемые относительные размеры шрифта: чистый способ принять размер шрифта для ребенка, а не родительский элемент) с числами, вычислениями - - более объяснительный, без надлежащего ответа:
Например, если у меня есть:
td { font-size: 1.3em }
h2 { font-size: 2em }
h3 { font-size: 1.6em }
p { font-size: 1.2 }
и у меня есть заголовки/абзацы внутри моих табличных ячеек, я знаю, что я могу избежать составления шрифтов следующими способами:
td h2, td h3, td p { font-size: 1em }
что приведет к заголовкам/параграфам в моих ячейках таблицы, имеющим размер шрифта 1.3em (значение td).
Но то, что я ищу, - это хороший, чистый способ для каждого дочернего элемента иметь оригинальный размер шрифта, а не родительский.
Мне бы очень хотелось избежать следующего (и, конечно, я бы хотел избежать использования px):
td h2 { font-size: 1.54em } // 1.3 x 1.54 ~ 2
td h3 { font-size: 1.23em } // 1.3 x 1.23 ~ 1.6
td p { font-size: 0.92em } // 1.3 x 0.92 ~ 1.2
Для всех, кто знаком с LESS, я использую это и думал, что должен использовать его для выполнения вычислений для меня, например. с помощью аксессуаров:
td h2 { font-size: h2['font-size'] / td['font-size'] }
Это, по крайней мере, использовало бы исходные значения для вычисления, но чувствует себя так же неуклюже, как и выше, и, кроме того, кажется, что LESS больше не поддерживает аксессуры.
Это кажется настолько простым в концепции, что я чувствую, что ответ смотрел мне в лицо, но я некоторое время ударяю головой об этом и не могу найти ответ нигде.
Пожалуйста, помогите! В этот момент, если кто-то скажет мне, что это невозможно, и что все в порядке, чтобы использовать пиксельные значения, я с радостью верю им!
Теперь может показаться, что мой вопрос... Есть ли лучший способ использовать относительные размеры шрифтов (или любой относительный размер - например, ширина, высота и т.д.), если не будут выполняться дочерние элементы родительским элементом?