font-weight
CSS свойство font-weight позволяет указать, насколько жирным будут выглядеть текст. Как вы знаете, жирный текст выглядит темнее и немного толще, чем обычный. Вы можете использовать жирный текст для любого тега, задав свойству значение bold .
Если у вас есть элемент, для которого по умолчанию задан жирный шрифт, или он наследует такой шрифт от родительского элемента, то можно уменьшить насыщенность шрифта с помощью значения normal .
Для свойства font-weight предусмотрены также два относительных значения: bolder и lighter . Они сделают текст более или менее плотным по сравнению с унаследованным значением. Эти значения используются редко, так как немногие шрифты поддерживают столь слабые различия в плотности.
Вы также можете устанавливать значения свойства с помощью чисел от 100 до 900, но это тоже не очень хорошо поддерживается шрифтами и браузерами и редко применяется.
| Значение по умолчанию: | normal |
|---|---|
| Применяется: | ко всем элементам |
| Анимируется: | да |
| Наследуется: | да |
| Версия: | CSS1 |
| Синтаксис JavaScript: | object.style.fontWeight=»900″ |
Синтаксис
font-weight: normal|bold|bolder|lighter|число|inherit;
Значения свойства
| Значение | Описание |
|---|---|
| normal | Определяет стандартное написание символов. |
| bold | Задает жирное начертание символов в тексте. |
| bolder | Тоже самое, что и bold. |
| lighter | тоже самое, что и normal. |
| 100 200 300 400 500 600 700 800 900 |
Определяет толщину шрифта по заданному значению, от 0 до 500 — стандартное начертание шрифта, от 600 до 900 — жирное начертание. |
| inherit | Указывает, что значение наследуется от родительского элемента. |
Конвертер текста в Жирный (Болд) стиль
При помощи этого конвертера вы сможете придать любому тексту или отдельным его словам эффект жирного (полужирного) начертания. То есть, сделать текст жирным (болд-эффект). Оформленные таким стилем куски текста рисуются более ярко, буквы становятся шире и объемнее. Выглядит такой текст солиднее, жирный стиль придает ему значимость и наглядность. С помощью жирного стиля в тексте можно создать абзацы и заголовки, выделить (отметить) отдельные слова и фразы, к которым следует привлечь внимание. Традиционно, в среде верстальщиков и компьютерщиков для определения понятия «жирный текст» используется английское слово «Bold» (Болд), в текстовых редакторах эта функция представлена кнопкой с буквой «Ж» (или «B»). Это один из самых используемых и применяемых стилей выделения текста. Представляем вашему вниманию первый онлайн-болд конвертер, который не требует специального программного обеспечения. Вы сможете сконвертировать текст в жирный и жирный курсив (жирный италик).
Болд стиль, эффект (конвертер) для букв, слов, заголовков, абзацей
«Bold» в переводе с английского означает «смелый», «уверенный», «дерзкий», «отчетливый». Читается это слово как «Боулд», но чаще всего пользователи компьютера произносят его просто как «Болд». Этот термин хорошо знаком всем, кому хотя бы раз приходилось набирать текст в современном текстовом редакторе. Называют этим словом просто жирный текст, выделенный более ярко, более толстой линией по сравнению с остальными литерами. Обычно жирный стиль или эффект используется при верстке текстов для выделения заголовков, подзаголовков или отдельных слов, на которые требуется обратить внимание читателя. Текст с наличием жирного стиля читается легче и воспринимается более эффективно. Любой более-менее продвинутый текстовый редактор (текстовый процессор) предлагает такую функцию, а более правильно называется она «Полужирный» стиль. Именно «Полужирный», поскольку на начальном этапе развития компьютерных текстовых редакторов (в середине 1980-х) существовало несколько жирных стилей, прижился же именно тот, который тогда было принято называть «Полужирный» (средний жирный, слабый жирный). Тем не менее, сегодня его именуют просто «Жирный», поскольку такой стиль остался один. Выделенный текст при применении опции отображается ярче, все его литеры становятся толще и насыщеннее, выглядят заметнее.
Как же это работает? Как создается жирный текст? Используя стандартный шрифт, программа рисует выбранные символы более широкими по специальному алгоритму. Это сделать нетрудно, поскольку все современные компьютерные шрифты — векторные, то есть содержат просто координаты точек, по которым рисуются литеры. Можно нарисовать букву хоть в километр высотой, пересчитав масштаб и вычислив новые координаты точек в зависимости от выбранного размера шрифта. Обычно толщина штриха жирного начертания задается больше на 25-30 процентов от обычного, но в различных шрифтах могут быть свои варианты исполнения жирного (например, в сочетании с курсивом жирный стиль рисуется тоньше). К сожалению, существует проблема совместимости (переносимости) жирного стиля. Функция «Bold» всегда имеет привязку к программе-редактору и не будет работать в другой (по крайней мере, также). Использование универсальных форматов документов (например, rtf) и шрифтов несколько упрощает задачу. Существуют и специальные болд-шрифты, в которых все литеры и так широкие изначально.
В Интернете для выделения заголовков и реализации Боулд-эффекта прибегают к другому способу, для этого используются теги или метки (инструкции программе), ими отмечается часть текста, которая должна быть выведена жирным. Анализатор текста или браузер при разборе такого текста обнаруживает инструкции и рисует часть текста выбранным стилем (в данном случае, жирным). Опять-таки мы имеем привызку к программе, для правильного отображения такого текста потребуется браузер. Существует ли универсальный вариант создания жирного текста, который будет работать на любом устройстве и в любой программе? Как же указать для любого текста, что его часть следует выделить жирным? Возможно самое простое решение — заменить часть текста, которая требует жирного выделения, другими символами, которые изначально должны отображаться болдом. Такие символы есть в кодировке Уникод (Unicode, UTF), и большинство современных устройств ее поддерживают изначально. Именно так и поступает наш конвертер, или как его называют «Генератор жирного текста».
Текст можно сделать более ярким, преобразовав литеры на альтернативные. В данном случае буквы просто заменяются на альтернативные из расширенной кодировки Unicode, имеющие более широкое начертание. Эта часть символов создавалась специально для отображения математических формул и букв, создана она для шрифтов семейства Serif. Следует учитывать, что сконвертированный таким образом текст уже не будет тем же: изменится его размер (текст будет занимать больше места), он не будет индексироваться поисковыми системами, по нему не будет работать поиск.
Возьмем, к примеру, слова «Example» и «��������������». Первое слово предсталено в обычном виде, а второе — в жирном. С точки зрения читателя все они имеют идентичное значение (второе, правда, более наглядное), но для компьютера это два совершенно разных слова (они состоят из разных кодовых символов). Попробуйте запустить поиск и найти слово «Example». Будет найдено только первое из них. Точно также, если попробовать поискать второе, мы найдем только то, которое имеет жирное начертание. Компьютер не сможет найти соответствие между ними, если это не указано (заложено в алгоритме) особо. Стоит учитывать эту особенность.
Также для правильного отображения этих символов поребуется поддержка устройством, установленные шрифты (но, как мы уже отметили выше, такая поддержка сегодня является стандартом, и только какие-нибудь старые устройства могут иметь проблемы с совместимостью). Для отдельных программ потребуется указать, что текст представлен в кодировке Уникод, иначе вы увидите квадратики вместо ожидаемых символов. Не для всех букв есть альтернативные символы, не все символы будут сконвертированы. Полностью поддерживается болд-конвертация для цифр и латинских букв и частично для кириллицы, неконвертируемые символы останутся без изменений. Рекомендуется использовать этот конвертер для создания коротких текстов для Интернета: сервисов соцсетей, Инстаграм, Твиттер. Онлайн-болдер, конвертер для преобразования текста в жирный стиль. Для выбора доступны опции: просто жирный (болд) и жирный + курсив (болд+италик, итальянсский болд, болд италлик). Сделать текст жирным онлайн можно с помощью нашего конвертера.
CSS шрифт, стиль и размер шрифта
Существует множество видов шрифтов, которые образуют так называемые семейства:
- Georgia, Times New Roman, serif
- Arial, Helvetica, sans-serif
- Courier New, Courier, monospace
- Verdana, Geneva, sans-serif
- Times New Roman, Times, serif
- Шрифт в CSS | Семейства шрифтов, примеры
- Шрифт в CSS | Изменяем вид и тип шрифта
- Тип CSS шрифта | Наклонный, жирный шрифт
- CSS шрифт | Определяем размер шрифта
CSS виды и семейства шрифтов:
| font-family: | Pезультат |
|---|---|
| Verdana, Geneva, sans-serif | Семейство шрифтов без засечек |
| Arial, Helvetica, sans-serif | Семейство шрифтов без засечек |
| ‘Times New Roman’, Times, serif | Семейство шрифтов с засечками |
| ‘Courier New’, Courier, monospace | Семейство моноширинных шрифтов |
Verdana, Geneva, sans-serif — семейство шрифтов без засечек:
Times New Roman, Times, serif — семейство шрифтов с засечками:
Courier New, Courier, monospace — семейство моноширинных шрифтов:
Еще пример форматирования:
Обычный текст
Текст жирный, размером 18 пикселей, наклонный, семейства Times New Roman
|
В примере выше стилевые описания распространяются на параграфы данного документа. Атрибут font-family: содержит три различных шрифта, одного семейства (с засечками). Указывать их можно в различном порядке, но будет применен первый или второй если браузер не сможет найти на компьютере пользователя установленный первый шрифт, или третий, если программа браузера не прочтет первые два. При написании кода, название, состоящее из нескольких слов выделяется кавычками, например, ‘Times New Roman’ .
Д ля web-сайтов рекомендуется применять шрифты без засечек, чтобы не затруднять чтение текста.
Шриф sans-serif является представителем семейства шрифтов без засечек. К нему относятся Verdana, Geneva и другие. Если прописать код: font-family: sans-serif — программа браузера выберет на компьютере пользователя один из шрифтов без засечек, например, Verdana . Если обозначить: font-family: serif — будет выбран шрифт семейства с засечками, например, Times . CSS aтрибут со значением font-family: monospace — установит моноширинный шрифт, к примеру, Courier New .
CSS aтрибут font-family: определит, выбранный вами, вид шрифта. Можно установить свой шрифт, но нет ни какой гарантии, что он будет присутствовать на компьютере пользователя. Если его там не окажется, программа браузера не сможет правильно интерпретировать, указанный вами, шриф.
CSS наклонный и жирный шрифт
Определим наклонный шрифт:
CSS атрибут со значением style=»font-style:italic» определяет наклонный шрифт.
Определим жирный шрифт:
CSS ключение style=»font-weight:bold» определяет жирный шрифт.
Определим нормальный объем шрифта:
Строчка style=»font-weight:300″ преобразует жирный шрифт в обычный.
CSS размер шрифта
Пример с изменением размера:
|
Текстовая строка размером 13 пикселей. Текстовая строка размером 16 пикселей. |
Текстовая строка размером 13 пикселей.
Текстовая строка размером 16 пикселей.
Автор проекта — Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018
CSS код в HTML CSS шрифт и его размер 
CSS свойства текста
© 2009 — 2023 | При использовании материала, ссылайтесь на мой сайт!
По всем вопросам обращайтесь: go@ab-w.net | CSS жирный шрифт, размер? – Не вопрос!
Как сделать шрифт тоньше?
Вот здесь шрифт толще других
Как сделать его тоньше?
Вот ссылка:zebtelatmtest.contentsia.com
- Вопрос задан более трёх лет назад
- 15684 просмотра
1 комментарий
Оценить 1 комментарий
Свойство font-weight позволяет задать толщину (насыщенность) шрифта.
Пример
body
p
Возможные значения
normal
Шрифт стандартной толщины (насыщенности)
bold
Стандартный полужирный шрифт
относительный размер
bolder или lighter.
точный размер
Задается в диапазоне от 100 до 900 с шагом 100. Стандартное значение normal соответствует 400, bold — 700.
inherit
Заимствует значение свойства у родительского элемента.
Решения вопроса 0