Установка цвета текста в CSS
belarusweb.net
© Петр Романовский Минск, 2016-2018.



belarusweb.net
Основы создания сайтов...

Установка цвета.
Свойства color и border-color

Мы уже неоднократно использовали наследуемое свойство color для установки цвета текста, при чем уже в процессе изучения языка гипертекстовой разметки HTML. Однако применение данного свойства влияет не только на сам текст, но и на цвет границ элемента в случае, если он не будет установлен явно. Поэтому, если нам нужен цвет границ отличный от цвета текста, необходимо задать его при помощи свойства border-color.

В качестве значений свойство color принимает цвет, который можно задать одним из допустимых способов, указав ключевое слово цвета, его шестнадцатеричное значение или же использовав синтаксис одной из цветовых моделей rgb, rgba, hsl или hsla. Кроме того, имеется специальное значение transparent, которое устанавливает прозрачный текст (см. пример 4.1). Также не забываем про универсальное значение inherit.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">	
	<title>Установка цвета текста</title>
	<style>
		.color_1{
		border: solid 2px;
		color: #995533;
		width: 300px;
		}
		.color_2{
		border: solid 2px green;
		color: rgba(40%,60%,90%,0.9);
		width: 300px;
		}
	</style>
</head>
<body>
	<p class="color_1">
		Цвет границы будет такой же, как
		у текста.
	</p>
	
	<p class="color_2">
		Цвет границы задали явно.
	</p>
</body>
</html>

Пример 4.1. Использование свойства color

Видеоуроки по курсу CSS

Комментарии (0)

Петр Романовский
1. Приветствуются комментарии, которые содержат дополнения к материалу текущей страницы, а также ваши ответы на вопросы других пользователей.
2. Если вам что-то непонятно - спрашивайте, не забывая написать, что именно и с какого места.
Показаны все комментарии
Чтобы оставить свой комментарий, авторизуйтесь, пожалуйста!