Введение в HTML — Элементы стиля шрифта
Введение в HTML — Элементы стиля шрифтаЯ не большой поклонник элементов стиля шрифта . Но мой долг рассказать вам о них. Может быть, вы найдете их полезными.
Элементы стиля шрифта похожи на элементы фразы в том смысле, что они используются для изменения фрагментов текста. Однако, как следует из названия, элементы стиля шрифта носят стилистический, а не структурный характер. И в этом заключается загвоздка. В HTML 4.0 большая часть стилистического форматирования выполняется с помощью таблиц стилей. Элементы стиля шрифта являются исключением, пережитком предыдущих версий HTML.
Здесь мы рассмотрим четыре элемента стиля шрифта:
- полужирный
- курсив
- маленький
- большой
Элемент bold указывает, что текст должен отображаться полужирным шрифтом. Вот пример абзаца, который содержит жирный элемент.
Важно: Все сотрудники должны носить смешные шляпы.
Вот код, который заставляет это работать:
<Р> Важно! Все сотрудники обязаны носить забавные шляпы.
Как видите, жирный элемент ограничен тегами и .
Элемент italic указывает, что текст должен отображаться курсивом. Вот пример абзаца, который содержит курсивный элемент.
Но я не хочу, чтобы носил забавную шляпу.
Вот код, который заставляет это работать:
<Р> Но я не хочу носить смешную шляпу.
Как видите, курсивный элемент ограничен тегами и .
Элемент
Не забудьте прочитать мелкий шрифт , прежде чем что-либо подписывать.
Вот код:
<Р> Не забудьте прочитать мелкий шрифт прежде чем что-либо подписывать.
Как видите, маленький элемент ограничен тегами и .
большой элемент аналогичен маленькому элементу, но работает наоборот. Вот пример абзаца с большим элементом:
На самом деле этот абзац содержит три экземпляра большого элемента. Они вложены друг в друга, чтобы продемонстрировать их кумулятивный эффект. (Маленький элемент работает так же.) Вот код:
<Р> Это действительно отличная распродажа
Как видите, большой элемент ограничен тегами и .
Все элементы стиля шрифта являются встроенными элементами.
предыдущий | Введение в HTML | Учебники | следующий
Font-Weight: жирный шрифт в CSS не работает
Как бы вы ни старались, вы просто не можете сделать этот текст жирным? Хорошо, что ты заглянул сюда; у нас есть советы для вас.
Опубликовано Автор Dim NikovВ категории CSS
Ситуация следующая: вы пытаетесь выделить часть текста на веб-странице полужирным шрифтом с помощью CSS. Но даже если ваше правило CSS написано правильно, свойство font-weight: bold просто не работает.
Я сталкивался с этой проблемой больше раз, чем могу сосчитать. И я написал это руководство, чтобы помочь вам и другим, подобным вам, не тратить часы на борьбу с этим.
вес шрифта: полужирный работает, читайте ниже.Почему ваше правило CSS не работает
Если ваше правило CSS для выделения текста в определенном элементе DOM жирным шрифтом отформатировано правильно, но по-прежнему не работает, возможно, оно переопределено другим правилом в одной из таблиц стилей HTML-документа .
Мы подробно писали об этом в статье под названием «Как предотвратить переопределение CSS».
Чтобы узнать подробности, прочтите этот пост, а затем вернитесь сюда и продолжите чтение. Короткую версию и быстрое исправление читайте ниже.
Итак, почему ваше правило CSS не работает?
Потому что свойство font-weight текста в рассматриваемом элементе DOM является целью другого правила CSS, которое переопределяет ваше.
Как правило, когда несколько правил CSS нацелены на одно и то же свойство одного и того же элемента DOM, то правило с наиболее конкретным селектором переопределяет другие.
<тело>
Жирный шрифт
Мы можем ориентироваться на font-weight свойство
Вот как это работает:
p { вес шрифта: полужирный; }
body p { вес шрифта: нормальный; }
p.bold { вес шрифта: полужирный; }
p#bold-1 {начертание шрифта: нормальное; }
/* Правила с ключевым словом !important переопределяют все остальные */
p { вес шрифта: полужирный! важно; } В CSS это называется специфичность .
По сути, правило CSS с наиболее конкретным селектором всегда преобладает над всеми остальными.
Как заставить это работать
Есть два способа заставить font-weight: полужирный работать для рассматриваемого элемента DOM (или элементов DOM).
Во-первых, нужно переписать селектор вашего правила CSS, чтобы он был более конкретным, чем селекторы любых других правил CSS, нацеленных на рассматриваемый элемент DOM. (При этом полезно открыть инспектор в инструментах разработчика вашего браузера и просмотреть эти селекторы.)
Второй способ — добавить ключевое слово !0033 font-weight: свойство жирным шрифтом в вашем правиле CSS.
Итак, если прямо сейчас ваше правило CSS выглядит так:
p { font-weight: bold; } Попробуйте сделать так — и посмотрите, решит ли это вашу проблему:
p { font-weight: bold !important; } Если вы пытаетесь переопределить правило CSS, встроенное в атрибут style="" элемента DOM, этот метод будет единственным, который будет работать.
В заключение
Помните: Когда вес шрифта: полужирный не работает, ваше правило CSS, скорее всего, переопределяется другим правилом CSS с более конкретным селектором.
Перепишите правило CSS с более конкретным селектором или добавьте ключевое слово
Спасибо, что дочитали до этого места, и, если у вас есть какие-либо вопросы или вы хотите поделиться своими советами с остальными читателями этого поста, не стесняйтесь оставлять ответ ниже.
Автор Дим Ников
Создатель контента с навыками маркетинга и веб-разработки для оплаты счетов.
Посмотреть все сообщения Дима Никова.
сообщить об этом объявлении- 9 лучших крутых игр с математикой
- Являются ли наклейки на ноутбуке непрофессиональными?
