CSS увеличить размер шрифта

Question

Я не эксперт в CSS, но у меня есть эта задача увеличить размер шрифта на сайте. Сайт использует загруженную CSS-тему. Как я вижу, есть один файл main.css, который содержит определения шрифтов. В других css-файлах размер шрифта устанавливается с использованием процентов.

Однако есть 102 матчей за слово font-size в самой main.css, поскольку он устанавливает размеры для всех возможных элементов HTML и их комбинации, как

body { font-size: 13px; } 
h1 { font-size: 32px; } 
h1.smaller { font-size: 31px; } 
h2 { font-size: 26px; } 

и так далее.

Я собираюсь написать сценарий, который будет извлекать значения размера шрифта $1 и заменять их $1+1.

Через некоторое время, возможно, есть более элегантное решение? Может быть, я могу переопределить размер шрифта каким-то образом с помощью самого CSS?

Answer 1

Я использовал следующий скрипт для преобразования всех font-size: [0-9]+px значения в em:

<?php 

$filename = "MyCss.css"; 

$css = file_get_contents($filename); 

$css = preg_replace('/font-size\s*\:\s*([0-9]+)\s*px/ie', '"font-size: " . ($1/16) . "em"', $css); 

file_put_contents($filename, $css); 

Ваш пример CSS выше стал:

body { font-size: 0.8125em; } 
h1 { font-size: 2em; } 
h1.smaller { font-size: 1.9375em; } 
h2 { font-size: 1.625em; } 

Я тогда рекомендую установить baseline размер шрифта на элемент HTML:

html { font-size: 16px; } 

T Если вы хотите глобально повлиять на все размеры шрифта на странице, вы можете изменить это единственное значение, и все шрифты с использованием em единиц будут масштабироваться.

Вы также можете использовать проценты, если хотите, но обычно предпочитаются em.

(К сожалению, Ruby является один из немногих языков я не знаю)