Как применить глобальный шрифт ко всему документу HTML

Question

У меня есть HTML-страница, которая включает в себя текст и форматирование. Я хочу, чтобы у него было то же семейство шрифтов и тот же размер текста, игнорируя все внутреннее форматирование текста.

Я хочу установить глобальный формат шрифта для страницы HTML.

Как мне этого добиться?

Answer 1

Вы должны быть в состоянии использовать элементы звездочки и !important в CSS.

html *
{
   font-size: 1em !important;
   color: #000 !important;
   font-family: Arial !important;
}

Звездочка соответствует всем (вы, вероятно, тоже можете обойтись без html).

!important гарантирует, что ничто не сможет переопределить то, что вы установили в этом стиле (если это также не важно).(это должно помочь вам выполнить требование «игнорировать внутреннее форматирование текста» - что я и имел ввиду, что другие стили не могли их перезаписать)

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

Answer 2

Лучшая практика, я думаю, это установить шрифт для тела:

body {
    font: normal 10px Verdana, Arial, sans-serif;
}

, и если вы решите изменить его на какой-то элемент, его можно легко перезаписать:

h2, h3 {
    font-size: 14px;
}

Answer 3

Установите его в селекторе тела вашего css.Например,

body {
    font: 16px Arial, sans-serif;
}

Answer 4

Используйте следующее css:

* {
    font: Verdana, Arial, 'sans-serif' !important;/* <-- fonts */
}

Селектор * означает любые / все элементы, но, очевидно, будет в нижней части пищевой цепи, когда дело доходит допереопределение более определенных селекторов.

Обратите внимание, что флаг !important сделает стиль font для * абсолютным, даже если для установки были использованы другие селекторытекст (например, body или, возможно, p).

Answer 5

Вы никогда не должны использовать * + !important. Что если вы хотите изменить шрифт в некоторых частях вашего HTML-документа? Вы должны всегда использовать тело без важного. Используйте !important, только если нет другой опции.

Answer 6

Попробуйте это:

body
{
    font-family:your font;
    font-size:your value;
    font-weight:your value;
}