font-weight
Устанавливает насыщенность шрифта. Значение устанавливается от 100 до 900 с шагом 100. Сверхсветлое начертание, которое может отобразить браузер, имеет значение 100, а сверхжирное — 900. Нормальное начертание шрифта (которое установлено по умолчанию) эквивалентно 400, стандартный полужирный текст — значению 700.
Синтаксис
Значения
Насыщенность шрифта задаётся с помощью ключевых слов: bold — полужирное начертание, normal — нормальное начертание. Также допустимо использовать условные единицы от 100 до 900. Значения bolder и lighter изменяют жирность относительно насыщенности родителя, соответственно, в большую и меньшую сторону.
HTML5 CSS2.1 IE Cr Op Sa Fx
font-weight Duis te feugifacilisi
, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Результат данного примера показан на рис. 1.
Рис. 1. Применение свойства font-weight
Объектная модель
[window.]document.getElementById(» elementID «).style.fontWeight
Браузеры
Браузеры обычно не могут адекватно показать требуемую насыщенность шрифта, поэтому переключаются между значениями bold , normal и lighter . На практике же начертание в браузерах обычно ограничено всего двумя вариантами: нормальное начертание и жирное начертание.
HTML b и strong
HTML теги и преобразуют текст в полужирный:
| Теги, преобразующие текст в полужирный. Теги, преобразующие текст в полужирный. |
Теги, преобразующие текст в полужирный.
Теги, преобразующие текст в полужирный.
В XHTML также присутствуют HTML теги и .
Информационные технологии стоят дорого
Возможно ли счастье в современном Мире? А вы знаете, что есть современный Мир?
Телекоммуникационная революция началась в середине 70-х годов и слилась с компьютерной. Она связана с созданием и развитием оптико-волоконных и спутниковых технологий. Слияние компьютерной и телекоммуникационной технологии привело к появлению на рынке нового вида товаров и услуг. Информационная и телекоммуникационная индустрия сегодня превратились в ключевой сектор экономики развитых государств. Информационные технологии стоят достаточно дорого, что обеспечивает мировым информационным лидерам высокий жизненный стандарт. Кроме этого, лидирование в сфере информационных технологии дает им возможность претендовать на лидерство в политике.
Автор проекта — Вася Митин | Дата публикации: Февраль 2010 | Обновление: Ноябрь 2018
HTML 5 теги
HTML ,
Теги
© 2009 — 2023 | При использовании материала, ссылайтесь на мой сайт!
По всем вопросам обращайтесь: go@ab-w.net | HTML b и strong? – Не вопрос!
Свойство font-weight: толщина начертания
Это задание архивной части. Перейдите по ссылке, чтобы пройти задание в актуальной части.
Полужирность текста можно задавать с помощью свойства font-weight , которое имеет два основных значения:
- normal — обычное начертание;
- bold — полужирное начертание.
На самом деле это свойство имеет много значений: bold, bolder, lighter, normal, 100, 200, 300, 400, 500, 600, 700, 800, 900. Эти значения задают степень толщины шрифта, от самого тонкого, до самого толстого.
Но большинство браузеров всё равно умеют отображать только два варианта толщины: обычный и полужирный. Поэтому и остальные значения свойства обычно не используют.
Хотите досконально разбираться в разметке, знать о доступности, строить сетки на флексбоксах? Записывайтесь на профессиональный курс по вёрстке первого уровня, проходящий c 29 января по 1 апреля 2024. До 27 ноября цена 19 900 ₽ 22 900 ₽
Перейти к заданию
- index.html Сплит-режим
- style.css Сплит-режим
Полужирный шрифт при наведении без сдвига макета
От автора: когда вы меняете font-weight шрифта, это обычно вызывает небольшое смещение макета. Это потому, что полужирный текст часто больше и занимает больше места. Иногда это не имеет значения, например, вертикальный стек ссылок, где более широкий / полужирный текст все равно ничего не смещает. Иногда это имеет значение, например, горизонтальный ряд, где более широкий / жирный текст слегка отодвигает другие элементы.
Райан Маллиган демонстрирует это. Техника Райана очень крута. Для каждого элемента в списке есть псевдо-элемент с точным текстом ссылки. Этот псевдо-элемент визуально скрыт, но предварительно выделен жирным шрифтом и по-прежнему занимает отведенную ширину. Поэтому, когда фактический текст ссылки выделен полужирным шрифтом, он не будет занимать дополнительной ширины.
Это также зависит от того, как вы создаете макет. Здесь, если я сделаю с помощью сетки CSS четыре столбца и добавлю текст, который на самом деле не влияет на ширину, выделение жирным шрифтом также не повлияет на макет:
Но если бы я, скажем, позволил этим ссылкам перетекать в автоматические столбцы, у нас возникла бы проблема смещения.
Автор: Chris Coyier
Редакция: Команда webformyself.
