Учебник по CSS

ГЛАВНАЯ CSS Введение в CSS Синтаксис CSS Селекторы CSS CSS как сделать CSS-комментарии Цвета CSS CSS-фоны CSS границы CSS поля CSS-заполнение CSS высота/ширина Блочная модель CSS Схема CSS CSS-текст CSS-шрифты CSS-иконки CSS-ссылки CSS-списки CSS-таблицы Отображение CSS Максимальная ширина CSS Позиция CSS CSS Z-индекс CSS переполнение Плавающая CSS Встроенный блок CSS Выравнивание CSS Комбинаторы CSS Псевдокласс CSS CSS-псевдоэлемент Непрозрачность CSS Панель навигации CSS Выпадающие списки CSS Галерея изображений CSS Спрайты изображений CSS Селекторы атрибутов CSS CSS-формы CSS-счетчики CSS макет веб-сайта Единицы CSS Специфика CSS CSS! важно Математические функции CSS

CSS расширенный

CSS закругленные углы Изображения границ CSS CSS-фоны Цвета CSS Цветовые ключевые слова CSS CSS-градиенты CSS-тени Текстовые эффекты CSS Веб-шрифты CSS 2D-преобразования CSS CSS 3D-преобразования CSS-переходы CSS-анимации Подсказки CSS Изображения в стиле CSS Отражение изображения CSS CSS объект-подгонка CSS-позиция объекта Маскировка CSS CSS-кнопки Разбивка на страницы CSS Несколько столбцов CSS Пользовательский интерфейс CSS CSS-переменные Размер блока CSS Медиа-запросы CSS Примеры CSS MQ CSS флексбокс

CSS Отзывчивый

Введение в задний привод Окно просмотра RWD Представление сетки RWD Медиа-запросы RWD Изображения RWD Видео с задним приводом Рамки RWD Шаблоны RWD

CSS -сетка

Введение в сетку Контейнер сетки Элемент сетки

CSS SASS

Учебник по SASS

Примеры CSS

CSS-шаблоны Примеры CSS css викторина CSS-упражнения Сертификат CSS

Ссылки на CSS

Справочник по CSS Селекторы CSS CSS-функции Справочник по CSS Безопасные веб-шрифты CSS CSS анимация Единицы CSS Конвертер CSS PX-EM Цвета CSS Значения цвета CSS Значения CSS по умолчанию Поддержка CSS-браузера

Цветовые ключевые слова CSS


На этой странице объясняются ключевые слова transparent, currentcolor, и inherit.


Прозрачное ключевое слово

Ключевое transparentслово используется, чтобы сделать цвет прозрачным. Это часто используется для создания прозрачного цвета фона для элемента.

Пример

Здесь цвет фона элемента <div> будет полностью прозрачным, а фоновое изображение просвечивает:

body {
  background-image: url("paper.gif");
}

div {
  background-color: transparent;
}

Примечание . Ключевое transparent слово эквивалентно rgba(0,0,0,0). Цветовые значения RGBA являются расширением цветовых значений RGB с альфа-каналом, который определяет непрозрачность цвета. Узнайте больше в нашей главе CSS RGB и в нашей главе CSS Colors .


Ключевое слово текущего цвета

Ключевое currentcolorслово похоже на переменную, которая содержит текущее значение свойства цвета элемента.

Это ключевое слово может быть полезно, если вы хотите, чтобы определенный цвет был одинаковым для элемента или страницы.

Пример

В этом примере цвет границы элемента <div> будет синим, потому что цвет текста элемента <div> синий:

div {
  color: blue;
  border: 10px solid currentcolor;
}

Пример

В этом примере цвет фона <div> устанавливается равным текущему значению цвета элемента body:

body {
  color: purple;
}

div {
  background-color: currentcolor;
}

Пример

В этом примере цвет границы и цвет тени <div> устанавливаются равными текущему значению цвета элемента body:

body {
 color: green;
}

div {
  box-shadow: 0px 0px 15px currentcolor;
  border: 5px solid currentcolor;
}

Наследовать ключевое слово

Ключевое inheritслово указывает, что свойство должно наследовать свое значение от родительского элемента.

Ключевое inheritслово можно использовать для любого свойства CSS и для любого элемента HTML.

Пример

В этом примере настройки границы <span> будут унаследованы от родительского элемента: 

div {
  border: 2px solid red;
}

span {
  border: inherit;
}