Css сделать текст жирным: Как сделать текст жирнее, чем с font-weight: bold? — Хабр Q&A

Как исправить проблему font-weight в состоянии hover

От автора: вы когда-нибудь пробовали изменить значение font-weight у ссылки в разных состояниях? Если да, то вы должны были заметить, что текст немного сдвигается. В этой статье мы сначала узнаем, что вызывает этот сдвиг, а затем рассмотрим два возможных решения данной проблемы.

Определяем проблему

Сначала давайте определим проблему на простом примере. Рассмотрим рисунок ниже:

Пункты меню – ссылки, т.е. в CSS будет что-то типа:

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

a:hover { font-weight: bold; }

Зачастую пунктам меню не задается фиксированная ширина, а это значит, что при наведении курсора мыши, текст немного сдвинется. Это происходит из-за того, что ширина ссылки при наведении на нее увеличивается. Чтобы продемонстрировать это, добавим класс active к первой ссылке со следующими стилями:

.active { font-weight: bold; }

Мы также изменили текст второго пункта на первый, чтобы они были равны:

Теперь если открыть панель разработчика в браузере и навести курсор на первые две ссылки, можно заметить, что они не равны. Все сказанное выше можно наглядно посмотреть в демо:

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

Надо сказать, что делать элемент жирным при наведении мыши не принято, но иногда может пригодиться.

Решение №1: задать всем пунктам ширину

Как говорилось выше, самый очевидный способ это задать всем пунктам меню ширину. В нашем примере мы задали ширину всех пунктов меню в 24%. Результат:

Этот способ работает, но он может не подойти нам. Есть случаи, когда нам нельзя добавлять фиксированную ширину элементов. Ну и на основе вышесказанного рассмотрим решение получше.

Решение №2: Text Shadow

Используя text-shadow, можно сымитировать эффект font-weight. Сделать это можно, правильно подобрав значение blur-radius.

В зависимости от используемых шрифтов в проекте можно скомбинировать свойства text-shadow и letter-spacing и создать красивые эффекты для текста. Чтобы продемонстрировать данный эффект, мы добавили пару строк CSS кода к нашим ссылкам:

a { letter-spacing: .1em; transition: text-shadow .3s; } a:hover { text-shadow: 0 0 .65px #333, 0 0 .65px #333; /* раскомментируйте строку ниже, если нужен более сильный эффект */ /* text-shadow: 0 0 .9px #333, 0 0 .9px #333, 0 0 .9px #333; */ }

Таким образом мы решили проблему со сдвигом текста, и нам не пришлось добавлять какую-либо ширину к элементам. И, как видите, данное решение намного лучше, чем font-weight, так как размер текста не изменяется вообще. Глазу намного приятнее.

Заключение

Если бы мне нужно было решить такую проблему, я воспользовался бы одним из двух представленных решений. А вы знаете какие-либо другие способы решения данной задачи? Пишите об этом в комментариях.

Автор: George Martsoukos

Источник: //www.sitepoint.com/

Редакция: Команда webformyself.

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

PSD to HTML

Верстка сайта на HTML5 и CSS3 с нуля

css выделить жирным текст | Все о Windows 10

На чтение 5 мин. Просмотров 21 Опубликовано

В HTML жирный текст можно сделать несколькими способами. К ним относятся:

• Тег b;
• Тег strong;
• CSS-свойство font-weight.

Поговорим о каждом из вариантов выделения текста по порядку.

1. Жирный текст: тег Тег b HTML применяется следующим образом: Для тега обязательно наличие закрывающего , и ему доступны универсальные атрибуты (такие как class, id, title и т.д.) Хотя валидность тега b и не осуждается спецификацией HTML, более актуальным в использовании является тег strong, давайте разберемся почему. Жирный текст: тег Согласно спецификации HTML, тег b служит для выделения текста жирным шрифтом. В отличие от него, тег strong HTML служит для выделения важных фрах, слов, которые являются ключевыми для данной страницы. Этот тег имеет весомое значение при ранжировании страниц в поисковой выдаче, поэтому он широко используется в продвижении сайтов и при SEO-оптимизации. Поисковые системы учитывают текст, заключенный в теги , и помечают его именно как важный. Используется тег strong аналогичным образом: Вы можете заметить, что внешне применение тегов и совсем не отличается (поскольку все современные браузеры интерпретируют их практически одинаково), но семантические различия в коде для поисковых систем, всё-таки, имеют место быть. Поэтому большинство SEO-оптимизаторов рекомендуют использовать тег strong. Жирный текст при помощи CSS Мы уже отмечали важность тега strong при поисковом продвижении, но что делать в случае, если нужно выделить большое количество текста жирным (но текст не нужно помечать для поисковиков как важный), или необходимо управлять степенью «жирности» шрифта? В таких случаях используется CSS-свойство font-weight. Применяется оно следующим образом: Значениями bolder и lighter можно задать степень жирности больше (или меньше), чем у родителя.
   Числовым значением (100-900) можно задать степень жирности. Internet Explorer Chrome Opera Safari Firefox Android iOS 6.0+ 1.0+ 3.5+ 1.0+ 1.0+ 1.0+ 1.0+ Краткая информация Значение по умолчанию normal Наследуется Да Применяется Ко всем элементам Ссылка на спецификацию http://www.w3.org/TR/CSS21/fonts.html#propdef-font-weight Версии CSS CSS 1 CSS 2 CSS 2.1 CSS 3 Описание Устанавливает насыщенность шрифта. Значение устанавливается от 100 до 900 с шагом 100. Сверхсветлое начертание, которое может отобразить браузер, имеет значение 100, а сверхжирное — 900. Нормальное начертание шрифта (которое установлено по умолчанию) эквивалентно 400, стандартный полужирный текст — значению 700. Синтаксис Значения Насыщенность шрифта задаётся с помощью ключевых слов: bold — полужирное начертание, normal — нормальное начертание. Также допустимо использовать условные единицы от 100 до 900. Значения bolder и lighter изменяют жирность относительно насыщенности родителя, соответственно, в большую и меньшую сторону. HTML5 CSS2.1 IE Cr Op Sa Fx Результат данного примера показан на рис. 1. Рис. 1. Применение свойства font-weight Объектная модель [window.]document.getElementBy >elementID «).style.fontWeight Браузеры Браузеры обычно не могут адекватно показать требуемую насыщенность шрифта, поэтому переключаются между значениями bold , normal и lighter . На практике же начертание в браузерах обычно ограничено всего двумя вариантами: нормальное начертание и жирное начертание. Заполняя свой сайт, мы обязательно сталкиваемся с необходимостью форматирования контента, для того, что бы придать ему более наглядный вид или обратить внимание читателя на какие-то основные моменты. В сегодняшней статье мы рассмотрим с вами как сделать подчеркнутый и жирный текст CSS-стилями и HTML-тегами. Хорошо, когда как в WordPress есть визуальный редактор и можно легко придать любому фрагменту необходимый стиль написания. Навигация по статье: Но бывают случаи, когда даже для сайта, сделанного с помощью CMS, приходится задавать форматирование CSS-стилями или HTML-тегами.
   В WordPress это касается заполнения виджетов «Текст», например, или редактирования текста в отдельных плагинах, которые не поддерживают визуальный редактор. Как сделать подчеркнутый текст CSS-стилями Чтобы как-то выделить фрагмент, и сделать его более заметным, мы можем сделать подчеркнутый текст css-стилями, используя свойство text-decoration:underline; style = «text-decoration:underline;» > Подчеркнутый текст CSS Подчеркнутый текст CSS Так же это CSS-свойство имеет и другие интересные значения: blink — позволяет сделать слово или предложение мерцающим, line-through — перечёркивает слово или предложение, overline — позволяет провести линию над словом. Это свойство так же используется для стилизации отображения ссылок по умолчанию. Поэтому, если вы хотите что бы ссылки на страницах вашего сайта отображались без подчеркивания, вам нужно задать для нее text-decoration: none; Подчеркнутый текст HTML-тегами Если вы столкнулись с необходимостью сделать подчеркивание в единичном случае, то конечно писать стили для этого одного фрагмента не целесообразно. В таких ситуациях вы можете сделать подчеркнутый текст средствами HTML. Для этого вам всего лишь нужно поместить нужный фрагмент между тегами … Как сделать жирный текст CSS-стилями Для выделения жирным в CSS предусмотрено свойство font-weight, которое в свою очередь имеет достаточно большое количество принимаемых значений, используя которые, вы можете подобрать для своей ситуации наиболее подходящий жирный текст css-стилями. Итак, свойство font-weight может принимать фиксированные значения: bold – жирный bolder – еще жирнее normal – начальный вид lighter – делает буквы тоньше, по сравнению с normal Кроме этого, можно использовать числовые значения, что бы подобрать степень жирности на свое усмотрение. Для этого можно задать число от 100 до 900, при этом 100 будет соответствовать значению lighter, а 900 будет иметь наибольшую жирность, на порядок выше, чем у значения bolder.
2. Жирный текст: тег Согласно спецификации HTML, тег b служит для выделения текста жирным шрифтом. В отличие от него, тег strong HTML служит для выделения важных фрах, слов, которые являются ключевыми для данной страницы. Этот тег имеет весомое значение при ранжировании страниц в поисковой выдаче, поэтому он широко используется в продвижении сайтов и при SEO-оптимизации. Поисковые системы учитывают текст, заключенный в теги , и помечают его именно как важный. Используется тег strong аналогичным образом: Вы можете заметить, что внешне применение тегов и совсем не отличается (поскольку все современные браузеры интерпретируют их практически одинаково), но семантические различия в коде для поисковых систем, всё-таки, имеют место быть. Поэтому большинство SEO-оптимизаторов рекомендуют использовать тег strong. Жирный текст при помощи CSS Мы уже отмечали важность тега strong при поисковом продвижении, но что делать в случае, если нужно выделить большое количество текста жирным (но текст не нужно помечать для поисковиков как важный), или необходимо управлять степенью «жирности» шрифта? В таких случаях используется CSS-свойство font-weight. Применяется оно следующим образом: Значениями bolder и lighter можно задать степень жирности больше (или меньше), чем у родителя. Числовым значением (100-900) можно задать степень жирности. Internet Explorer Chrome Opera Safari Firefox Android iOS 6.0+ 1.0+ 3.5+ 1.0+ 1.0+ 1.0+ 1.0+ Краткая информация Значение по умолчанию normal Наследуется Да Применяется Ко всем элементам Ссылка на спецификацию http://www.w3.org/TR/CSS21/fonts.html#propdef-font-weight Версии CSS CSS 1 CSS 2 CSS 2.1 CSS 3 Описание Устанавливает насыщенность шрифта. Значение устанавливается от 100 до 900 с шагом 100. Сверхсветлое начертание, которое может отобразить браузер, имеет значение 100, а сверхжирное — 900. Нормальное начертание шрифта (которое установлено по умолчанию) эквивалентно 400, стандартный полужирный текст — значению 700. Синтаксис Значения Насыщенность шрифта задаётся с помощью ключевых слов: bold — полужирное начертание, normal — нормальное начертание. Также допустимо использовать условные единицы от 100 до 900. Значения bolder и lighter изменяют жирность относительно насыщенности родителя, соответственно, в большую и меньшую сторону. HTML5 CSS2.1 IE Cr Op Sa Fx Результат данного примера показан на рис. 1. Рис. 1. Применение свойства font-weight Объектная модель [window.]document.getElementBy >elementID «).style.fontWeight Браузеры Браузеры обычно не могут адекватно показать требуемую насыщенность шрифта, поэтому переключаются между значениями bold , normal и lighter . На практике же начертание в браузерах обычно ограничено всего двумя вариантами: нормальное начертание и жирное начертание. Заполняя свой сайт, мы обязательно сталкиваемся с необходимостью форматирования контента, для того, что бы придать ему более наглядный вид или обратить внимание читателя на какие-то основные моменты. В сегодняшней статье мы рассмотрим с вами как сделать подчеркнутый и жирный текст CSS-стилями и HTML-тегами. Хорошо, когда как в WordPress есть визуальный редактор и можно легко придать любому фрагменту необходимый стиль написания. Навигация по статье: Но бывают случаи, когда даже для сайта, сделанного с помощью CMS, приходится задавать форматирование CSS-стилями или HTML-тегами. В WordPress это касается заполнения виджетов «Текст», например, или редактирования текста в отдельных плагинах, которые не поддерживают визуальный редактор. Как сделать подчеркнутый текст CSS-стилями Чтобы как-то выделить фрагмент, и сделать его более заметным, мы можем сделать подчеркнутый текст css-стилями, используя свойство text-decoration:underline; style = «text-decoration:underline;» > Подчеркнутый текст CSS Подчеркнутый текст CSS Так же это CSS-свойство имеет и другие интересные значения: blink — позволяет сделать слово или предложение мерцающим, line-through — перечёркивает слово или предложение, overline — позволяет провести линию над словом. Это свойство так же используется для стилизации отображения ссылок по умолчанию. Поэтому, если вы хотите что бы ссылки на страницах вашего сайта отображались без подчеркивания, вам нужно задать для нее text-decoration: none; Подчеркнутый текст HTML-тегами Если вы столкнулись с необходимостью сделать подчеркивание в единичном случае, то конечно писать стили для этого одного фрагмента не целесообразно. В таких ситуациях вы можете сделать подчеркнутый текст средствами HTML. Для этого вам всего лишь нужно поместить нужный фрагмент между тегами … Как сделать жирный текст CSS-стилями Для выделения жирным в CSS предусмотрено свойство font-weight, которое в свою очередь имеет достаточно большое количество принимаемых значений, используя которые, вы можете подобрать для своей ситуации наиболее подходящий жирный текст css-стилями. Итак, свойство font-weight может принимать фиксированные значения: bold – жирный bolder – еще жирнее normal – начальный вид lighter – делает буквы тоньше, по сравнению с normal Кроме этого, можно использовать числовые значения, что бы подобрать степень жирности на свое усмотрение. Для этого можно задать число от 100 до 900, при этом 100 будет соответствовать значению lighter, а 900 будет иметь наибольшую жирность, на порядок выше, чем у значения bolder.
3. Жирный текст при помощи CSS
4. Краткая информация
5. Версии CSS
6. Описание
7. Синтаксис
8. Значения
9. Объектная модель
10. Браузеры
11. Навигация по статье:
12. Как сделать подчеркнутый текст CSS-стилями
13. Подчеркнутый текст HTML-тегами
14. Как сделать жирный текст CSS-стилями

Жирный текст: тег

Тег b HTML применяется следующим образом:

Для тега обязательно наличие закрывающего , и ему доступны универсальные атрибуты (такие как class, id, title и т.д.)

Хотя валидность тега b и не осуждается спецификацией HTML, более актуальным в использовании является тег strong, давайте разберемся почему.

Жирный текст: тег

Согласно спецификации HTML, тег b служит для выделения текста жирным шрифтом. В отличие от него, тег strong HTML служит для выделения важных фрах, слов, которые являются ключевыми для данной страницы.

Этот тег имеет весомое значение при ранжировании страниц в поисковой выдаче, поэтому он широко используется в продвижении сайтов и при SEO-оптимизации. Поисковые системы учитывают текст, заключенный в теги , и помечают его именно как важный.

Используется тег strong аналогичным образом:

Вы можете заметить, что внешне применение тегов и совсем не отличается (поскольку все современные браузеры интерпретируют их практически одинаково), но семантические различия в коде для поисковых систем, всё-таки, имеют место быть. Поэтому большинство SEO-оптимизаторов рекомендуют использовать тег strong.

Жирный текст при помощи CSS

Мы уже отмечали важность тега strong при поисковом продвижении, но что делать в случае, если нужно выделить большое количество текста жирным (но текст не нужно помечать для поисковиков как важный), или необходимо управлять степенью «жирности» шрифта? В таких случаях используется CSS-свойство font-weight. Применяется оно следующим образом:

Значениями bolder и lighter можно задать степень жирности больше (или меньше), чем у родителя. Числовым значением (100-900) можно задать степень жирности.

Краткая информация

Версии CSS

CSS 1	CSS 2	CSS 2. 1	CSS 3

Описание

Устанавливает насыщенность шрифта. Значение устанавливается от 100 до 900 с шагом 100. Сверхсветлое начертание, которое может отобразить браузер, имеет значение 100, а сверхжирное — 900. Нормальное начертание шрифта (которое установлено по умолчанию) эквивалентно 400, стандартный полужирный текст — значению 700.

Синтаксис

Значения

Насыщенность шрифта задаётся с помощью ключевых слов: bold — полужирное начертание, normal — нормальное начертание. Также допустимо использовать условные единицы от 100 до 900. Значения bolder и lighter изменяют жирность относительно насыщенности родителя, соответственно, в большую и меньшую сторону.

HTML5 CSS2.1 IE Cr Op Sa Fx

Результат данного примера показан на рис. 1.

Рис. 1. Применение свойства font-weight

Объектная модель

[window.]document.getElementBy >elementID «).style.fontWeight

Браузеры

Браузеры обычно не могут адекватно показать требуемую насыщенность шрифта, поэтому переключаются между значениями bold , normal и lighter . На практике же начертание в браузерах обычно ограничено всего двумя вариантами: нормальное начертание и жирное начертание.

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

В сегодняшней статье мы рассмотрим с вами как сделать подчеркнутый и жирный текст CSS-стилями и HTML-тегами. Хорошо, когда как в WordPress есть визуальный редактор и можно легко придать любому фрагменту необходимый стиль написания.

Навигация по статье:

Но бывают случаи, когда даже для сайта, сделанного с помощью CMS, приходится задавать форматирование CSS-стилями или HTML-тегами. В WordPress это касается заполнения виджетов «Текст», например, или редактирования текста в отдельных плагинах, которые не поддерживают визуальный редактор.

Как сделать подчеркнутый текст CSS-стилями

Чтобы как-то выделить фрагмент, и сделать его более заметным, мы можем сделать подчеркнутый текст css-стилями, используя свойство text-decoration:underline;

style = «text-decoration:underline;» > Подчеркнутый текст CSS

Подчеркнутый текст CSS

Так же это CSS-свойство имеет и другие интересные значения:

• blink — позволяет сделать слово или предложение мерцающим,
• line-through — перечёркивает слово или предложение,
• overline — позволяет провести линию над словом.

Это свойство так же используется для стилизации отображения ссылок по умолчанию. Поэтому, если вы хотите что бы ссылки на страницах вашего сайта отображались без подчеркивания, вам нужно задать для нее text-decoration: none;

Подчеркнутый текст HTML-тегами

Если вы столкнулись с необходимостью сделать подчеркивание в единичном случае, то конечно писать стили для этого одного фрагмента не целесообразно. В таких ситуациях вы можете сделать подчеркнутый текст средствами HTML. Для этого вам всего лишь нужно поместить нужный фрагмент между тегами …

Как сделать жирный текст CSS-стилями

Для выделения жирным в CSS предусмотрено свойство font-weight, которое в свою очередь имеет достаточно большое количество принимаемых значений, используя которые, вы можете подобрать для своей ситуации наиболее подходящий жирный текст css-стилями.

Итак, свойство font-weight может принимать фиксированные значения:

• bold – жирный
• bolder – еще жирнее
• normal – начальный вид
• lighter – делает буквы тоньше, по сравнению с normal

Кроме этого, можно использовать числовые значения, что бы подобрать степень жирности на свое усмотрение. Для этого можно задать число от 100 до 900, при этом 100 будет соответствовать значению lighter, а 900 будет иметь наибольшую жирность, на порядок выше, чем у значения bolder.

Что полужирный шрифт в ворде. Как сделать текст жирным в word

Чаще всего самым простым способом обратить внимание читателя к нужному слову в тексте или предложению, заголовку является изменение атрибутов шрифта. Обычно шрифт меняют на полужирный или курсив. Такие атрибуты носят название начертание шрифта. Шрифт, кроме выше названных, имеет и другие атрибуты, такие как размер (или кегль) и гарнитура.

Форматирование документа можно осуществлять по ходу набора текста, так и по его окончанию. Надо помнить, что прежде чем форматировать текст, его надо выделить. Исключением является только форматирование отдельно взятого слова, для форматирования которого нужно просто установить на него курсор.

Все параметры форматирования, имеющие отношение к шрифту, расположены в диалоговом окне Шрифт. Чтобы вызвать это окно, надо выполнить одно из ниже описанных действий:

1. На вкладке главная внизу группы Шрифт, нажать на стрелку, направленную вниз.

2. Воспользоваться комбинацией клавиш CTRL и D

3. В контекстном меню выбрать пункт Шрифт.

В диалоговом окне Шрифт есть две вкладки, именуемые Шрифт и Интервал. Теперь рассмотрим доступные параметры.

На вкладке Шрифт, изображенной ниже на рисунке, можно выбрать начертание шрифта, (обычный шрифт, полужирный, курсив или полужирный курсив), цвет текста, размер и цвет символов.

Вкладка интервал, показанная на следующем рисунке, определяет расстояние между символами шрифта. Шрифт, в зависимости от варианта, который вы выберете, будет обычным, уплотненным или разреженным.

Здесь же выбирается масштаб, при котором символы расширяются или сужаются (если масштаб составляет более 100 процентов, то текст документа растягивается, и наоборот, сужается, если масштаб меньше, чем 100 процентов).

Смотрите также:

Вам понравился материал?
Поделитeсь.

Жирными буквами текст в Microsoft Word можно написать несколькими способами.

Как в Ворде писать слова жирными буквами?

Для этого необходимо либо перед написанием текста нажать на соответствующую клавишу для жирного текста, либо выделить уже написанный текст и нажать на клавишу для оформления текста. На верхней панели инструментов, нажать на кнопку с буквой «Ж». Правой клавиши мыши нажать на «лист» в Microsoft Word.

В выпадающем меню выбрать кнопку с буквой «Ж». Вне зависимости от версии года выпуска пакета MS Office, а соответственно и программы Word, наиболее быстрым и эффективным способом, который поможет сделать введённый текст жирным является следующие шаги. Ну этот вопрос не должен заставить долго мучаться. Вам нужно открыть документ Ворд и обратить внимание на верхнюю панель. Там вы сможете сразу же увидеть значок с буквой «ж». Так вот нажав на данный значок, вы и получите жирный шрифт.

Кстати жирным шрифтом можно сделать уже напечатанный текст, выделив его и нажав на «ж». Для этого нужно будет активировать кнопку «Ж», которая находится рядом с кнопками «К» курсив и «Ч» подчеркивание в верхней панели Worda. Понять, активирована эта кнопка или нет, можно легко: Также можно выделить жирным шрифтом какой — то текст можно потом, после написания ядом этого выделяете нужный текст и жмете на ту же кнопку — «Ж».

Сделать жирный шрифт в Microsoft Word очень просто. В начале нужно написать текст, затем его выделить и нажать кнопку Ж на верхней панели. Рядом также есть буквы К — курсив и Ч — подчеркивание чертой.

И еще, можно сразу нажать на букву Ж и тогда печать сразу пойдет жирным шрифтом, не потребуется выделения текста. Главное запомнить расположение буквы Ж на панели и тогда печать жирного текста не составит труда. После этого начинайте печатать — текст будет жирным. Если уже набрали текст и его нужно сделать жирным, то просто выделяем нужные слова или фрагмент текста, после чего жмем по этому же значку — готово! Самый очевидный способ — это выделить нужную часть текста и нажать сверху кнопку Ж.

Она есть в верхнем меню во всех версиях Ворда, даже в онлайновой. Я лично пользуюсь клавиатурной командой. В текстовом редакторе «Microsoft Word» по простому в Ворде писать слова жирным шрифтом можно таким образом — напанели инструментов нажать на черную букву Ж и писать слова — они сразу будут выделяться.

Если вы у нас впервые: Как в Ворде писать слова жирными буквами? Расположение кнопки «жирный текст» для Microsoft Word Вне зависимости от версии года выпуска пакета MS Office, а соответственно и программы Word, наиболее быстрым и эффективным способом, который поможет сделать введённый текст жирным является следующие шаги: Для этого нужно будет активировать кнопку «Ж», которая находится рядом с кнопками «К» курсив и «Ч» подчеркивание в верхней панели Worda: Для того, чтобы написать в Ворде жирными буквами, нужно: Или в верхней части экрана нажать на закладку «Главное» и нажать на «Ж».

Выделение текста полужирным шрифтом — Word

Выделить строку, и нажать букву Ж-т. Можно просто сначала нажать Ж, и писать. Можно ли и как определить название шрифта — на сайте, в тексте, программе? Как настроить размер шрифта в Rambler-почте? Как на БВ увеличить шрифт? Какой нужен шрифт в Ворде для высоты строки 0. Как сделать жирный шрифт, чтобы выделить фрагмент текста на БВ? Как увеличить шрифт в Google Chrome?

Как увеличить шрифт в Опере? Как увеличить шрифт в Интернет Эксплойере? Как увеличить шрифт в Мозилле? Задайте его нашему сообществу, у нас наверняка найдется ответ! Делитесь опытом и знаниями, зарабатывайте награды и репутацию, заводите новых интересных друзей! Задавайте интересные вопросы, давайте качественные ответы и зарабатывайте деньги.

Дата создния: 2009-12-25

Эта тема, так же как и все те, которые мы уже прошли, очень лёгкая. Самое главное в HTML, помнить, что большинство тегов имеют и открывающиеся и закрывающиеся теги. Хотя не стоит забывать о тегах, которые не требуют закрытия. А так же не мало важно то, что все теги должны писаться в строгой последовательности:
«открытиеА » «открытиеВ » «ТЕКСТ » «/закрытиеВ » «/закрытиеА «

Итак, приступим.

1. Как сделать текст в HTML полужирным, подчёркнутым, зачёркнутым и курсивом.

полужирным , используйте тег:
полужирным

Для того, чтобы сделать текст подчёркнутым , используйте тег:
подчёркнутым

Для того, чтобы сделать текст зачёркнутым , используйте любой из тегов:
зачёркнутый
зачёркнутый

Для того, чтобы сделать текст курсивом , используйте тег:
курсивом

Теперь давайте применим все это на практике. Заходим в наш пример и применим к тексту наши новые стили:

Теперь сохраняем, обновляем в браузере, и если у Вас текст странички сошёлся с моим, то и результат должен быть таким:

Результат: Вы научились придавать тексту Вашей странички полужирный, подчеркнутый, зачеркнутый и курсивный стили.

!!!Стили можно совмещать:
полужирным подчёркнутый курсив

2.

В этой части статьи Вы научитесь делать текст HTML странички верхним и нижним индексами, как задать моноширинный текст и как сделать по отношению к основному тексту малый и крупный шрифты.

Итак, для всего этого есть определённые теги. Давайте их рассмотрим:

Для того, чтобы сделать текст верхнего индекса , используйте тег:
^{верхний индекс}

Для того, чтобы сделать текст нижнего индекса , используйте тег:
_{нижний индекс}

Для того, чтобы сделать текст моноширинным (шрифт с символами одинаковой фиксированной ширины), используйте любой из тегов:
моноширинный текст

Для того, чтобы сделать шрифт относительно всего текста — малым , используйте тег:
малый шрифт

Для того, чтобы сделать шрифт относительно текста — большим , используйте тег:
большой шрифт

Так, готово. Теперь давайте применим это на практике к нашему примеру. Для этого я очищу страничку от лишних тегов, задающих резмер текста, а затем к очищенному применю тег моноширинного текста … (тег

...

Отлично, теперь снова сохраняем документ и обновляем браузер.

Результат: Вы научились делать шрифт HTML странички верхним индексом (как 2 2 =4 ), нижним индексом (как Н 2 О ), малым , большим и моноширинным .

Сегодня расскажу как сделать слова жирным шрифтом на сайте с помощью HTML и CSS. Такое оформление используется когда вам нужно выделить определенную информацию на странице. Причем речь идет не только о заголовках, но и о простых словах, фразах в тексте. Реализовывается это достаточно просто.

Для выделения определенного текста жирным используются специальные HTML теги — и . Например следующий код:

Обычный текст.

Жирный текст.

Жирный текст strong.

На выходе дает такую картинку:

Последние два варианта визуально выглядят одинаково, однако они между собой немного отличаются. Тег задает простое стилистическое выделение слова жирным шрифтом, тогда как добавляет при этом некое семантическое «усиленное» (важное) значение. То есть последняя строка — это не просто жирный текст, а какая-то важная информация. В принципе, для поисковиков рекомендуют использовать именно .

Вы также можете встретить прописанный в HTML жирный шрифт с помощью стилей:

Пример жирного текста.

Пример текста с жирным словом.

На сайте это отображается так:

Не смотря на то, что код жирного текста для HTML работает корректно, так делать не следует. Все стили оформления должны быть вынесены в CSS файл. Поэтому в примере выше вы должны были для тегов

И указать соответствующий класс, а затем прописать его оформление в таблице стилей. Такие вот правила оформления кода. Поэтому для жирного шрифта в HTML используйте тег .

Жирный текст на CSS

Дабы сделать в CSS жирный шрифт используется свойство font-weight. С его помощью указывается «насыщенность» фрагмента текста. Значения могут быть от 100 до 900, но наиболее часто используемые это:

• bold (жирный) — 700 по умолчанию;
• normal (обычный) — 400 по умолчанию.

Есть также варианты значений bolder и lighter, которые меняют шрифт в зависимости от родителя на более или менее жирный соответственно.

Чтобы задать жирный текст в CSS нужно тому или иному элементу задать какой-то стиль, например:

Обычный текст с жирным выделением по центру.

strong { font-weight: bold; }

Тут хотелось отметить один небольшой нюанс, который мне рассказали на — если вы создаете для какого-то элемента новый класс, то желательно использовать более-менее «понятное название». Например, в примере выше стиль class=»my-bold-font» выглядит логичнее чем class=»new-font», т.к. можно отчасти понять его назначение. Это плюс для тех, кто будет смотреть и использовать вашу верстку в дальнейшем.

В следующей статье расскажу про интересные жирные шрифты, которые мне удалось найти.

CSS / HTML: Как правильно сделать текст курсивом?

что такое правильно способ сделать текст курсивом? Я видел следующие четыре подхода:

<i>Italic Text</i>

<em>Italic Text</em>

<span>Italic Text</span>

<span>Italic Text</span>

это «старый путь». <i> не имеет семантического значения и только передает презентационный эффект выделения текста курсивом. Насколько я могу видеть, это явно неправильно, потому что это несемантично.

это использует семантическую отметьте для чисто презентационных целей. Так уж получилось, что <em> по умолчанию выводит текст курсивом и поэтому он часто используется теми, кто знает, что <i> следует избегать, но кто не знает о его семантическом значении. Не весь курсивный текст является курсивом, потому что он подчеркнут. Иногда это может быть прямо противоположное, как боковая нота или шепот.

это использует класс CSS для размещения презентации. Это часто бывает преподносится как правильный путь, но опять же, это кажется мне неверным. Это, кажется, не передает больше семантического значения, что <i>. Но, плачут его сторонники, гораздо легче изменить весь свой курсивный текст позже, если вы, скажем, хотите, чтобы он был жирным. Но это не так, потому что я бы тогда остался с классом под названием «курсив», который выделил текст жирным шрифтом. Кроме того, неясно, почему я когда-либо хотел бы изменить весь курсивный текст на своем веб-сайте или, по крайней мере, мы можем думать о случаях, когда это не будет будьте желательны или необходимы.

это использует класс CSS для семантики. Пока это кажется лучшим способом, но на самом деле у него есть две проблемы.

1. не весь текст имеет достаточное значение, чтобы гарантировать семантическую разметку. Например, действительно ли выделенный курсивом текст в нижней части страницы является сноской? Или это в сторону? Или что-то совсем другое. Возможно, это не имеет особого значения и только должно быть выделено курсивом, чтобы отделить его Презентационно от текста, предшествующего ему.

2. семантический смысл может меняться, когда он не присутствует в достаточной степени. Допустим, я согласился с «сноской», основанной не более чем на тексте, находящемся в нижней части страницы. Что происходит, когда через несколько месяцев я хочу добавить больше текста внизу? Это уже не сноска. Как мы можем выбрать семантический класс, который менее универсален, чем <em> но избегает этих проблемы?

похоже, что требование семантики кажется чрезмерно обременительным во многих случаях, когда желание сделать что-то курсивом не должно нести семантический смысл.

кроме того, желание отделить стиль от структуры привело к тому, что CSS рекламируется как замена <i> когда есть случаи, когда это было бы на самом деле менее полезно. Так что это оставляет меня со смиренными <i> тег и интересно, является ли этот ход мысли причиной, почему он остается в спецификации HTML5?

есть ли хорошие сообщения в блоге или статьи на эту тему? Возможно, теми, кто участвует в решении сохранить / создать <i> тег?

Внешний вид текста в html-документе

В данном уроке html мы познакомимся с тегами, отвечающими за внешний вид текста, и научимся этими тегами пользоваться. И так, давайте попробуем в нашем файле html изменить цвет текста какого-нибудь абзаца из серого на зеленый.

За внешний вид текста в html-документе отвечает тег <font>. Это тег парный: значит в конце абзаца нам необходимо его закрыть — </font>.

Сам по себе тег <font> ничего не значит. Важность ему придают его атрибуты. Так что, если мы хотим придать тексту абзаца определенный цвет, мы должны прописать атрибут, отвечающий за цвет. Это атрибут color к которому необходимо добавить значение цвета.

Пример:

<p><font color=»green»>Текст абзаца стал зеленым</font></p>

Так же на примере видно, что тег <font> — вложенный тег, он прописан внутри тега <p>.

Кроме атрибута color, тег <font> имеет еще один важный атрибут — это атрибут face. Он отвечает за шрифт текста — какой шрифт будет использоваться в этом абзаце. Самые распространенные шрифты на сегодня — это Verdana, Tahoma. Рекомендуется пользоваться именно этими шрифтами, так как при использовании экзотических шрифтов, таковых может не оказаться на компьютере посетителя вашего сайта и страница у него будет отображаться стандартным шрифтом.

Пример:

<p><font color=»green» face=»Verdana»>Текст абзаца шрифтом Verdana</font></p>

Теперь давайте разберемся со способами выделения в тексте. Бывают моменты, когда необходимо выделить часть абзаца, одно слово или весь абзац. За выделение текста жирным шрифтом отвечает тег <strong>. Именно ту часть текста, которую мы хотим выделить жирным, помещаем внутрь тега <strong>.

Пример:

<p>Текст абзаца<strong>выделение в тексте жирным</strong>текст</p>

Если же мы хотим сделать выделение в тексте курсивом, применяем тег <em>.

Пример:

<p>Текст абзаца<em>выделение курсивом</em>текст</p>

При желании, текст можно выделить и жирным, и курсивом. В этом случае к тегу <strong> добавим еще тег <em>:

Пример:

<p>Текст <strong><em>выделение жирным курсивом </em></strong> текст</p>

В литературе вы можете встретить, что для выделения текста жирным применяется тег <b>. Это устаревший тег. Именно он использовался для выделения текста жирным в предыдущих версиях языка html. Тоже самое и с курсивом: раньше, для выделения текста курсивом, использовался тег <i>.

Следующий урок — размещение изображения.

Как оформить текст в CSS

Это пятый урок изучения CSS. В этом уроке мы рассмотрим семейство шрифтов, как задать размер текста, стиль текста, а также как сделать его жирным.

Перед изучением CSS пройдите предыдущие уроки:

Теория и практика

Чтобы красиво оформить текст на странице, придать ему привлекательный вид, необходимо знать некоторые CSS свойства которые помогут сделать это.

font-family

Начнем с семейств шрифтов. Всего существует огромное количество видов шрифтов, но не все одинаково отображаются в разных браузерах и системах. Это зависит от того присутствует ли данный файл со шрифтами в системе(установлен ли он).

Рассмотрим CSS код:

1
2
3

p {
   font-family: comic sans ms, times new roman, verdana;
}

Лучше всего название шрифта писать в нижнем регистре. Тогда браузеры их лучше понимают. У вас наверное появился вопрос почему мы указали сразу несколько шрифтов. Это делается для того, чтобы если первый шрифт «comic sans ms» не установлен у пользователя на компьютере, тогда текст будет показан в «times new roman». Если и он не установлен, тогда он будет показан со шрифтом «verdana».

font-size

После того как мы выбрали шрифт, нам необходимо задать его размер. В CSS это делается с помощью свойства font-size. Размер в CSS может задаваться с помощью нескольких величин: пиксели(px), проценты(%), пункты(em) и ключевые слова(small, large, medium). Я рекомендую вам использовать пиксели, и т.к. бразуеры их хорошо масштабируют.

Рассмотрим CSS код:

1
2
3
4

p{
    font-family: comic sans ms, times new roman, verdana;
    font-size:16px;
}

font-style

Также в CSS текст можно делать курсивный и наклонный. Это делается с помощью свойства font-style. У данного свойства есть несколько значений:

Вот пример курсивного и наклонного текста(разница есть, но она не очень заметная).

font-weight

Еще одним из необходимых свойств при работе с текстом это — выделение текста жирным. За это отвечает свойство font-weight.

Пример CSS кода:

1
2
3
4
5
6

p{
    font-family: comic sans ms, times new roman, verdana;
    font-size:16px;
    font-style:italic;
    font-weight:bold;
}

Ниже можете посмотреть пример и скачать его:

Посмотреть примерСкачать

Сегодня мы рассмотрели как задать оформление тексту. Пробуйте всё прописать руками. Тогда вы лучше запомните материал.

Больше практикуйтесь!

Html как сделать шрифт не жирным

Как сделать жирный шрифт в HTML | GuruWeba

Как выделить текст жирным с помощью HTML

Блокнот Blogger*a: сделать ШРИФТ ЖИРНЫМ и НАКЛОННЫМ

Параметры текста в HTML: шрифты, курсив, жирный и другие | Info-line.net

Как подключить шрифт | Как создать сайт

Блокнот Blogger*a: сделать ШРИФТ ЖИРНЫМ и НАКЛОННЫМ

Как задать шрифт в html \u2013 начертание, стиль, размер и многое другое

Форматирование текста в HTML — теги оформления контента

Жирный или подчеркнутый текст в CSS и HTML | Impuls-Web.ru

3 Способа подключения шрифтов на сайт (CSS, Google Fonts..)

Жирный, курсив, зачеркнутый шрифт Whatsapp как поменять, писать текст

О шрифтах в Photoshop

Жирный, курсив, зачеркнутый шрифт Whatsapp как поменять, писать текст

Как сделать жирный шрифт в HTML | WebShake.RU

Добавляем шрифты Google Fonts на HTML сайт MotoCMS — MotoCMS Blog

Как писать Вконтакте жирным и зачеркнутым шрифтом?

Как сделать шрифт с контуром в word?

Жирный, курсив, зачеркнутый шрифт Whatsapp как поменять, писать текст

Авто мир: Форматирование текста

HTML тег \u003cb\u003e

HTML5-формы: улучшенные возможности, новые типы полей и атрибуты

Список шрифтов для использования в HTML-коде | HD Systems Worldwide

Презентация на тему: \

Работа в визуальном HTML редакторе

Список шрифтов для использования в HTML-коде | HD Systems Worldwide

7 практических советов усовершенствования дизайна сайта

Теги форматирования текста в HTML (h2, p, b, strong, font)

HTML-текст

Как использовать основные теги HTML для SEO \u2014 STRONG, B, EM, I

Whatsapp: как зачеркнуть текст, сделать шрифт жирным или курсивом

Как использовать теги цвета шрифта в HTML

В iOS 7 для iPhone и iPad можно сделать жирный шрифт | iBobr.ru

Как сделать жирный шрифт в HTML?

Текстовые HTML-теги для форматирование: что это и как применять

3 Способа подключения шрифтов на сайт (CSS, Google Fonts..)

Правила Font (Weight, Family, Size, Style) и Line Height для …

HTML и CSS для владельцев сайтов. Верстка для не программистов / СоХабр

Как сделать жирный шрифт 🚩 как сделать шрифт жирнее в фотошопе …

Жирный текст в HTML. Курсив HTML. Большой и маленький текст в HTML …

Как сделать жирный шрифт в ВК

Список шрифтов для использования в HTML-коде | HD Systems Worldwide

Как писать разными шрифтами в Telegram (жирным, курсивом)?

Размер шрифта в html: как его указать, увеличить, изменить

Font-weight: bolder для шрифтов со множеством начертаний

Урок 4: Шрифты в CSS

Разная толщина шрифта в браузере и photoshop — Для начинающих — Учим …

Разметка текста 101 (Форматирование в чате: Жирный, Курсив …

Как в Телеграмме сделать жирный шрифт на телефоне: как писать или …

8.6 Вставить ответ из вопроса. Работа с html \u2014 DigSee Sure \u2014 опросы …

Как писать разным шрифтом в программе скайп

Как писать жирным шрифтом в ВК?

Оформление текстов в HTML (часть 2) » Новости SEO

Заголовки | htmlbook.ru

UTF-шрифты — графические значки, спецсимволы HTML и XHTML в таблице …

Использование шрифтов в InDesign

Синтаксис CSS. Подключение внешних таблиц к HTML. Урок создания …

Шпаргалка фронтендера: гид по таблицам | GeekBrains …

Нестандартные шрифты в web, вместе с FontSquirrel \u2014 CSS-LIVE

Как форматировать текст в сообщениях Telegram — Лайфхакер

жирный шрифт в таблице при XHTML 1.0 Strict — Для начинающих — Учим …

Как писать жирным шрифтом или зачеркнутым текстом в Скайпе

Пример создания простой html страницы. Как создать html-документа в …

Как сделать жирный шрифт в HTML?

Как изменить шрифт на сайте WordPress. Как добавить новый шрифт в …

Стилизация шрифтов | Как создать сайт

Зачеркнутый текст в Скайпе и другие возможности форматирования

Windows 10: как изменить размер шрифта (чтобы он не был таким мелким …

Ответы@Mail.Ru: Как в фотошопе cs6 сделать текст жирным? как?

Как изменить шрифт на компьютере в Windows 7

Как сделать жирный шрифт в отзывах на фикбуке?

В iOS 7 для iPhone и iPad можно сделать жирный шрифт | iBobr.ru

Bootstrap — Оформление и работа с текстом | ИТ Шеф

Невозможная типографика

Как сделать шрифты iOS 7 более читаемыми » Ремонт iPhone 8, Ремонт …

Про старые IE, EOT и CSS3111 | Блокнот Готтфрида Квадратного

Кастомизация OpenCart с помощью модуля html и bootstrap

Свой шрифт на странице | htmlbook.ru

HTML шрифты. Работаем со шрифтами в HTML: гарнитура, размер, цвет …

Стили шрифтов. CSS cвойства шрифтов — online presentation

шрифтов — CSS: выделение текста жирным шрифтом без изменения размера контейнера

Это очень старый вопрос, но я возвращаюсь к нему, потому что у меня была эта проблема в приложении, которое я разрабатываю, и я нашел здесь все необходимые ответы.

(пропустите этот абзац для TL; DR …) Я использую шрифт Gotham с сайта cloud.typography.com, и у меня есть кнопки, которые начинаются пустыми (с белой рамкой / текстом и прозрачным фоном) и приобретает цвет фона при наведении курсора. Я обнаружил, что некоторые из используемых мной цветов фона плохо контрастируют с белым текстом, поэтому я хотел изменить текст на черный для этих кнопок, но — из-за визуального трюка или обычных методов сглаживания — темный текст на светлом фоне всегда кажется более светлым, чем белый текст на темном фоне.Я обнаружил, что увеличение веса темного текста с 400 до 500 обеспечивает почти такой же «визуальный» вес. Тем не менее, он увеличивал ширину кнопки на крошечную величину — доли пикселя — но этого было достаточно, чтобы кнопки выглядели слегка «дрожащими», от чего я хотел избавиться.

Решение:

Очевидно, что это действительно привередливая проблема, поэтому требовалось придирчивое решение. В конечном итоге я использовал отрицательный межбуквенный интервал для более жирного текста, как рекомендовал cgTag выше, но 1px был бы излишним, поэтому я просто рассчитал именно ту ширину, которая мне нужна.

Изучив кнопку в Chrome devtools, я обнаружил, что ширина моей кнопки по умолчанию была 165,47 пикселей и 165,69 пикселей при наведении, разница в 0,22 пикселей. На кнопке было 9 символов, итого:

0,22 / 9 = 0,024444 пикселей

Преобразовав это в единицы измерения em, я смог сделать настройку независимой от размера шрифта. Моя кнопка использовала размер шрифта 16 пикселей, поэтому:

0,024444 / 16 = 0,001527em

Итак, для моего конкретного шрифта следующий CSS сохраняет кнопки точно одинаковой ширины при наведении курсора:

 .btn {
  font-weight: 400;
}

.btn: hover {
  font-weight: 500;
  межбуквенный интервал: -0.001527em;
}
  

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

Единственное предостережение заключается в том, что разные браузеры используют несколько разные вычисления субпикселей, поэтому, если вы стремитесь к этому уровню OCD с идеальной точностью до субпикселей, вам нужно будет повторить тестирование и установить разные значения для каждого браузера. . Стили CSS, ориентированные на браузер, обычно не одобряются по уважительной причине, но я думаю, что это один из вариантов использования, в котором это единственный вариант, который имеет смысл.

Как выделить текст жирным шрифтом с помощью CSS?

Как выделить текст полужирным шрифтом с помощью CSS?

Мы знаем, что в HTML у нас есть теги и , чтобы сделать содержимое жирным. Когда дело доходит до выделения текста жирным шрифтом с помощью CSS, у нас также есть соответствующее свойство, чтобы сделать то же самое.

Мы будем использовать свойство CSS font-weight, чтобы сделать содержимое жирным. У нас есть множество вариантов для установки уровня толщины нашего текста.

• normal: Это нормальный шрифт. Это то же самое, что 400, числовое значение по умолчанию для жирности.
• жирный: Это жирный шрифт. То же, что и 700.
• более жирный: Он устанавливает более жирный шрифт , чем родительский элемент.
• легче: Он устанавливает более легкий шрифт , чем родительский элемент
• <число>: Значение <число> от 1 до 1000 включительно (в порядке возрастания уровня жирности).

Если указано более светлое или жирное, на приведенной ниже диаграмме показано, как определяется абсолютный вес шрифта элемента.

Пример 1: Следующий пример демонстрирует простой текст, который выделен жирным шрифтом с использованием свойства CSS font-weight.

HTML

Выход:

 размер шрифта: 18 пикселей; 

: 'georgia'; 

 font-weight: жирный; 

 выравнивание текста: по центру; 

 #header {
} 

 #header {
  размер шрифта: 18 пикселей;
  семейство шрифтов: 'грузия';
  font-weight: жирный;
  выравнивание текста: центр;
} 

 #header {font-size: 18px; font-family: 'georgia'; font-weight: bold; text-align: center;} 

 размер шрифта: 18 пикселей;
семейство шрифтов: 'грузия';
font-weight: жирный;
выравнивание текста: центр;
 

 p {
    размер шрифта: 18 пикселей;
}
#header {
    выравнивание текста: центр;
}
тело {
    семейство шрифтов: 'грузия';
}
кнопка {
    font-weight: жирный;
    размер шрифта: 16 пикселей;
}
 

  тень текста: 0 0 1px черный;
тень текста: 0 0 1px черный, 0 0 1px черный; // смелее
  

  text-stroke: 1px черный;
-webkit-text-stroke: 1px черный; // Firefox и Edge
  

  @mixin m-hover-ie {
  @media all and (-ms-high-Contrast: none), (-ms-high-Contrast: active) {
     @содержание;
  }
 a: hover {
        текстовая обводка: 1px черный;
        -webkit-text-stroke: 1px черный;
    }
     @include m-hover-ie {
       &: hover {
        тень текста: 0 0 1px черный;
       }
    }
  }
}
  

  @mixin m-hover-firefox {
    @media (-moz-touch-enabled: 0) {
        @содержание;
    }
}
a: hover {
      тень текста: 0 0 1px;
      @include m-hover-firefox {
        тень текста: 0 0 .2px;
      }
}
  

/ * Значения ключевых слов * /
шрифт: нормальный;
font-weight: жирный;

/ * Значения ключевого слова относительно родительского * /
font-weight: светлее;
font-weight: жирнее;

/ * Числовые значения ключевых слов * /
font-weight: 1
font-weight: 100;
font-weight: 100,6;
font-weight: 123;
font-weight: 200;
font-weight: 300;
font-weight: 321;
font-weight: 400;
font-weight: 500;
font-weight: 600;
font-weight: 700;
font-weight: 800;
font-weight: 900;
font-weight: 1000;

/ * Глобальные значения * /
вес шрифта: наследовать;
font-weight: начальный;
font-weight: не установлено;
 

/ * Использование text-shadow в сочетании с межбуквенным интервалом для придания более жирного эффекта * /
цвет: #fff
межбуквенный интервал: 2 пикселя;
тень текста: 2px 0 #fff;
 

  div.button div {
              padding-left: 0! важно;
              отступ справа: 0! важно;
              ширина: 100%! важно;
            }