Style font bold css: HTML DOM Style fontWeight Property

Подробное руководство по весу шрифта CSS

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

Вы можете определить вес с помощью доступных ключевых слов или чисел, кратных 100, вплоть до 900. Толщина шрифта увеличивается пропорционально числу.

Синтаксис: font-weight: normal|bold|lighter|bolder|number|initial|inherit|unset;

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

Значения свойств

для веса шрифта в CSS

На основе этого синтаксиса значения свойства представляют:

• Нормальный: Представляет стандартный вес шрифта. Числовой эквивалент обычного ключевого слова — 400.
• Bold: это значение свойства помогает определить полужирный шрифт. Числовой эквивалент этого свойства — 700.
• Lighter: значение этого свойства связано с весом шрифта родительского класса. Использование этого ключевого слова сделает толщину шрифта на один уровень светлее, чем шрифт в родительском классе.
• Жирнее: Как и значение свойства «светлее», еще более жирный шрифт связан с размером шрифта родительского класса. Однако это ключевое слово увеличит вес шрифта на один уровень, а не сделает шрифт светлее.
• Число: вместо того, чтобы записывать ключевое слово «число» в качестве значения свойства, вам нужно написать числа 100, 200, …, 900. Если вес для указанного числа недоступен для данного семейства шрифтов, применяется предпочтительный номер .

Глобальные значения толщины шрифта в CSS

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

• Исходное: Исходное ключевое слово сбросит толщину шрифта до значения по умолчанию.
• Inherit: это глобальное значение сбросит толщину шрифта до значения, унаследованного от родительского класса элемента.
• Unset: это сбросит значение обратно к весу шрифта, унаследованному от родительского класса, если он доступен. Если вес не унаследован от родительского класса, он сбрасывает его до исходного значения по умолчанию.

Общие относительные веса шрифта для более светлых и жирных значений

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

Унаследованное значение	Смелее	Зажигалка
100	400	100
200	400	100
300	400	100
400	700	100
500	700	100
600	900	400
700	900	400
800	900	700
900	900	700

Примечание.

При переходе на относительный шрифт учитываются только четыре значения: 100, 400, 700 и 900, независимо от семейства шрифтов.

Сопоставление имени общего веса шрифта

Все числовые значения от 100 до 1000 соответствуют общепринятым названиям гирь, как указано в таблице ниже. Но использование имен, отличных от обычных и полужирных, в CSS не допускается.

Значение	Сопоставленное имя
100	Тонкий
200	Сверхлегкий
300	Легкий
400	Обычный
500	Средний
600	полужирный
700	Жирный
800	Очень жирный
900	Черный
950	Экстра черный

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

Пример использования толщины шрифта в CSS

В этом примере мы будем использовать все стандартные значения свойств.

  <заголовок>

    

  

  <тело>

    

Обычный шрифт

    

Жирный шрифт

    

Светлее шрифт

    

Более жирный шрифт

    

Вес 100

    

Вес 200

    

вес 300

    

вес 400

    

вес 500

    

вес 600

    

вес 700

    

вес 800

    

вес 900

  

Выход:

Браузеры, поддерживающие свойство CSS Font-Weight

Свойство CSS font-weight поддерживается следующими браузерами.

Имя браузера	Версия
Гугл Хром	2,0
Сафари	1,0
Мозилла Фаерфокс	1,0
Microsoft Edge	12,0
Опера	3,5

Продвигайтесь по карьерной лестнице в качестве разработчика стека MEAN с помощью программы Full Stack Web Developer — MEAN Stack Master’s Program. Зарегистрируйтесь сейчас!

Заключение

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

CSS — это язык стилей, который помогает стилизовать веб-страницу, но сначала вам нужно создать страницу. Узнайте, как это сделать и как CSS сочетается с другими интерфейсными языками программирования, записавшись в нашу программу последипломного образования в Full Stack Web Development. Вы также можете пройти наш 90-дневный бесплатный курс Front-End Web Development. Эти курсы разработаны, чтобы помочь вам приобрести практические знания и практическую практику для глубокого понимания концепций, тем самым предоставив вам инструменты для обеспечения лучших возможностей трудоустройства.

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

• Категория сообщения: CSS

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

Table of Contents

Введение

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

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

Что делать, если мы хотим отобразить HTML-элемент жирным шрифтом без использования тега HTML, как нам это сделать, конечно, мы можем воспользоваться помощью свойств CSS. Свойства CSS также помогают нам выполнять форматирование или стилизацию. Одним из важных свойств CSS, позволяющих отображать текст жирным шрифтом, является свойство font-weight. Свойство CSS font-weight используется для указания жирности шрифта или текста. Существуют различные значения, которые мы можем присвоить свойству CSS font-weight.

Пример:

 
 Это обычный шрифт. 
 Этот шрифт жирный. 
 Этот шрифт светлее. 
Этот шрифт более жирный. 
 Этот шрифт имеет вес 100. 
                                        
 Этот шрифт имеет вес 900. 
 

Значения: обычный | зажигалка | жирный | смелее | От 100 до 900 толщин

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

Использование функции Нормализация по весу шрифта

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

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

 
<голова>

<тип стиля="текст/CSS">
б {
вес шрифта: нормальный;
}


<тело>
Здравствуйте
Все

 

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

Нажмите здесь

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

paragraph.

Текст жирным шрифтом при наведении CSS

 
<голова>


<тип стиля="текст/CSS">
а: наведите {
вес шрифта: жирнее;
}

<тело>
 com">Нажмите здесь
  
 

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

Нажмите здесь

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

Bold vs Bolder

Большинство браузеров точно не поддерживают варианты жирного и полужирного шрифта, поэтому визуально они идентичны.

Значение, выделенное жирным шрифтом	Более жирный шрифт
Жирный шрифт — это индивидуальный вес шрифта.	Жирнее — относительный вес шрифта.
Значения не наследуются от родителей	Значения выбирают вес шрифта относительно веса, унаследованного от родителя. Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт