Как в HTML изменить цвет текста разными способами?

Статьи
Как в HTML изменить цвет текста разными способами?

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

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

Задание цвета в HTML

Текстовые блоки обычно заключаются в специальные «контейнеры». К ним можно отнести теги <p>, <h1>, <h2>, <div> и другие. Для наглядности покажу одну «конструкцию».

<div>

<h1>Заголовок публикации</h1>

<p>Первый абзац</p>

<h2>Подзаголовок публикации</h2>

<p>Второй абзац</p>

</div>

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

<p style=”color:red”>

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

<div style=”color:red”>

Параметры red, black и другие применяются крайне редко. Обычно используют шестнадцатеричный код.

#000000 — черный.

#336600 — темно-зеленый.

#006699 — синий.

Вариант применения — <div style=”color:#336600”>

Кстати, таблицу с кодами разнообразных расцветок можете посмотреть здесь.

Делаем цветной текст через CSS

В CSS (таблица стилей) можно прописать, к примеру, конструкцию, представленную ниже.

h2{color:#006699;}

Знаете, в чем отличается данный способ от вышеупомянутого? На самом деле все достаточно просто. Первый способ позволял менять цвет для конкретного абзаца, заголовка или иного участка. В рассматриваемом сейчас случае цвет будет изменен для всех подзаголовков второго уровня на электронных страницах, к которым подключается данный файл CSS.

Рекомендации

Наиболее важная из них — не превращайте текст в «светофор». Обилие разнообразных цветов в одном материале может существенно усложнить удобство её восприятия. Очень высока вероятность, что это негативно отразиться на нормальном продвижении проекта.

Если взглянуть на ситуацию в общем, то стоит задуматься о дизайне сайта в целом. Какие из них считаются хорошими читайте здесь.

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

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

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

Хочу оценить статью:
  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
Рейтинг: 5
Голосов: 1

Добавить комментарий

Комментариев - 0