Свойство CSS colorProperty
Пример
Установите цвет текста для разных элементов:
body {
color:red;
}
h1 {
color:#0080FF;
}
p {
color:rgb(0,0,255);
}
Попробуйте сами »
Определение атрибута и инструкции по использованию
Свойство Color задает цвет текста.
| Значение по умолчанию: | не указано |
|---|---|
| Наследуется: | Да |
| версия: | CSS1 |
| Синтаксис JavaScript: | object.style.color="#FF0000" |
Поддержка браузеров
Число в таблице указывает первую версию браузера, поддерживающую это свойство.
Число перед -webkit-, -ms- или -moz- указывает на первую версию браузера, которая поддерживает свойство с префиксом.
| Свойство | |||||
|---|---|---|---|---|---|
| color | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
Советы и примечания
Совет:Используйте разумные сочетания фона и цвета текста для улучшения читаемости текста.
Значение свойства
Значения цвета можно задать следующими способами:
| Значение | Описание | Пример |
|---|---|---|
| Названия цветов. | Название цвета, например red, blue, brown, lightseagreen и т. д., не зависит от регистра. |
color:red; /* 红色 */ color:black; /* 黑色 */ color:gray; /* 灰色 */ color:white; /* 白色 */ color:purple; /* 紫色 */ |
| Шестнадцатеричная | Шестнадцатеричная запись #RRGGBB и #RGB (например, #ff0000). После "#" следуют 6 или 3 шестнадцатеричных символа (0-9, A-F). |
#f03 #F03 #FF0033 #FF0033 rgb(255,0,51) rgb(255, 0, 51) |
| RGB, красный-зелёный-синий (красный-зелёный-синий (RGB)) | Задаёт цвет как код цвета rgb. Формат функции — rgb(R,G,B), а значения могут быть целыми числами в диапазоне 0-255 или процентами. |
rgb(255,0,51) rgb(255, 0, 51) rgb(100%,0%,20%) rgb(100%, 0%, 20%) |
| RGBA, красный-зелёный-синий-альфа (RGBa) | RGBa расширяет цветовую модель RGB, включая альфа-канал, позволяющий задать прозрачность цвета. a обозначает прозрачность: 0=прозрачный; 1=непрозрачный. |
rgba(255,0,0,0.1) /* 10% 不透明 */ rgba(255,0,0,0.4) /* 40% 不透明 */ rgba(255,0,0,0.7) /* 70% 不透明 */ rgba(255,0,0, 1) /* 不透明，即红色 */ |
| HSL, тон-насыщенность-светлота (Тон-насыщенность-светлота) | Тон представляет собой угол на цветовом круге (круге, представляющем радугу). Насыщенность и светлота выражаются в процентах. 100% — это полная насыщенность, а 0% — оттенок серого. 100% светлоты — это белый, 0% светлоты — чёрный, а 50% светлоты — "нормальный". |
hsl(120,100%,25%) /* 深绿色 */ hsl(120,100%,50%) /* 绿色 */ hsl(120,100%,75%) /* 浅绿色 */ |
| HSLA, цветовой тон-насыщенность-светлота-альфа (HSLa) | HSLa расширяет цветовую модель HSL, добавляя альфа-канал, что позволяет задавать прозрачность цвета. a обозначает прозрачность: 0=прозрачный; 1=непрозрачный. |
hsla(240,100%,50%,0.05) /* 5% 不透明 */ hsla(240,100%,50%, 0.4) /* 40% 不透明 */ hsla(240,100%,50%, 0.7) /* 70% 不透明 */ hsla(240,100%,50%, 1) /* 完全不透明 */ |
Другие примеры
Связанные статьи
Учебник по CSS:Форматирование текста CSS
Другие расширения