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

Содержание

• этапы
• Метод 1 из 3: Используйте теги HTML
• Метод 2 из 3: Используйте CSS в тегах

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

этапы

Метод 1 из 3: Используйте теги HTML

1. 
   

   
   Создайте тег шрифта. Положить тег перед е вы хотите раскрасить. Закройте это, поставив в конце эл.
   • Например:
     Я хочу, чтобы это было синим

2. 
   

   
   Добавьте атрибут для цвета. добавлять color = "" внутри открывающего тега. Затем вы должны поставить цвет по вашему выбору в кавычки (на английском языке).
   • Например:
     Я хочу, чтобы это было синим

3. 
   

   
   Выберите название цвета. Это всегда простое слово на английском, без пробела. Попробуйте простые имена, такие как «синий», «красный» или что-то более конкретное, например «светло-синий» (темно-синий) или «темно-синий» (темно-синий). Для большего выбора найдите список допустимых цветовых названий, таких как бордовый, стальной синий и салатовый.
   • Например:
     Я хочу, чтобы это было синим

4. 
   

   
   
   
   Вместо этого используйте шестнадцатеричный код. HTML позволяет выбирать из миллионов цветов, но для них не всегда есть названия. Вместо этого вы будете использовать шестизначный код в системе, называемой шестнадцатеричным. Есть много сайтов, которые предлагают шестнадцатеричные списки кодов для цветов, или вы можете даже выбрать цвет прямо на экране, чтобы получить код. Номер начинается с символа #, за которым следуют шесть цифр, состоящих из цифр от 0 до 9 и букв от d до F.
   • Код # FF0000 такой же, как красный цвет с пометкой «красный».
   • Этот код генерирует зеленый цвет.
   • Этот код делает е в синем.

5. 
   

   
   Играйте со значениями RGB. Вам не нужно знать, как работает шестнадцатеричный цветовой код, чтобы выбрать понравившийся вам цвет в палитре, которую вы найдете в Интернете. Однако, если вы хотите провести несколько экспериментов, вы должны начать с основ.
   • Каждое шестизначное число делится на значения для красного, зеленого и синего (или «RGB» для «красного, зеленого, синего»). Например, код # FF0000 фактически означает «красный: FF, зеленый: 00, синий: 00».
   • Чтобы изменить количество красного, измените первые две цифры. Вы можете использовать значение от 00 (красного нет вообще) до 99 (немного красного) и от AA (немного больше красного) до FF (красный максимум).
   • Используйте ту же систему, чтобы изменить значение зеленого (две средние цифры) и синего (две последние цифры).

6. 
   

   
   
   
   Понять код в глубине. Чтобы получить более точный выбор цвета, вам необходимо понять две другие концепции.
   • Каждое из этих трех значений состоит из двузначного числа. Чтобы внести небольшие изменения, вы можете изменить вторую цифру. Например: #850000 и #890000 очень похожи, но # A50000 намного понятнее
   • Значения RGB смешиваются на основе аддитивной системы синтеза цвета. Красная и зеленая марка желтый, синий и зеленый делают циан и красный и синий делают фуксин .

Метод 2 из 3: Используйте CSS в тегах

1. 
   

   
   Вставьте атрибут «style» в тег. Этот атрибут позволяет вам помещать CSS прямо в тег HTML. Это простой способ изменить цвет, даже если вы не знаете CSS. Попробуйте поместить его в один из следующих тегов:

   • тег p окружает абзац знаком e

   • тег окружен ссылкой
   • используйте тег span для изменения цвета части e без изменения формата

2. 
   

   
   Укажите цвет. Вставить цвет: сопровождается именем цвета или шестнадцатеричного кода внутри кавычек. Для получения дополнительной информации об именах цветов см. Примеры в предыдущем методе.
   • E теперь в красном.
   • Вот код для темно-оливкового зеленого.
   • CSS поддерживает трехзначные сокращенные цветовые коды. Код 745 является аббревиатурой 774455.

3. 
   

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

     этот абзац

     будет отображаться темно-зеленым цветом с широким курсивным шрифтом.
   • Знайте, что вам не нужно называть свой класс «модным», вы можете дать ему желаемое имя.