Верстка

Как задать цвет текста в CSS — меняем цвет текста с помощью стилей

🗓️ Обновлено: 17.08.2022
💬Комментариев: 0
👁️Просмотров: 2265

Ответ на вопрос

Ответ на вопрос «Как поменять цвет текста в CSS» довольно простой — с помощью свойства color. Достаточно задать нужному селектору (элементу, классу, айди и тд) свойство color с определенным значением. Чаще всего на практике это выглядит вот так:

p {
  color: #ffffff;
}

Вот так мы задали белый цвет текста для всех блоков <p>.

Разные форматы

На что стоит обратить внимание — цвет можно указывать в разных форматах.

Например, вместо #ffffff — вы можете прописать white и цвет все также будет белым. Или вместо шести символов f прописать только три — все равно будет работать. Еще можете указать цвет с помощью RGB системы. Это когда вы смешиваете три цвета (красный, зеленый и синий), чтобы получить один. Тогда формат будет вот такой:

p {
  color: rgb(255,255,255);
}

Цвет все такой же белый.

Как задать прозрачность текста

Чтобы задать прозрачность для текста, достаточно воспользоваться расширенной версией rgb — rgba. Здесь мы четвертым параметром задаем прозрачность (от 0 до 1). Вот, для наглядности, сделаем черный текст чуточку прозрачным:

p {
  color: rgba(0,0,0,0.5);
}

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

Статья была полезной?
👍
Да - 4
👎
Нет - 3
Рекомендуем к прочтению
Как запретить копировать текст на сайте
Как закомментировать код в CSS
Появление элементов при скролле
💬Комментарии:

CSS Головоломки в Telegram
Подписывайся и не пропускай:
Актуальные новости
Интересные задачки
Полезные подборки
Перейти в Telegram
Наш рейтинг
🏆Лучший хостинг для сайта
1
Ukraine
9/10
2
HostPro
8/10
3
TutHost
8/10
4
Hostiq
8/10
5
Cityhost
8/10
6
Freehost
7/10
7
UAhosting
7/10
Что читают?
🏆Популярные записи
Как сделать гамбургер (бургер) меню — готовый код и подробное объяснение
Просмотров: 36708
Появление элементов при скролле
Просмотров: 29253
Как сделать плавное увеличение картинки при наведении — эффект на чистом CSS
Просмотров: 23015
Как выровнять картинку по центру с помощью CSS
Просмотров: 17845
Как изменить цвет SVG в CSS
Просмотров: 15685
Проверка знаний
🤔Хорошо ли вы знаете CSS?
Есть два блочных элемента, которые идут друг за другом в html. Какой будет оступ (margin) между ними, если задать им такие стили: 

.top {
  height: 30px;
  background-color: blue;
  margin-bottom: 10px;
}
.bottom {
  height: 30px;
  background-color: red;
  margin-top: 20px;
}
10px
20px
30px
Viva Magenta
🤔Цвет 2023 года
Исследовательский институт Pantone выбрал главный цвет 2023 года. Им стал карминово-красный оттенок с фиолетовым подтоном, который назвали Viva Magenta.
#bb2649