Что такое color, примеры использования

О свойстве color

1. Что такое color?
2. Пример color в атрибуте style :
3. Пример color в теге style
4. Пример color в файле css

Что такое color?

Что такое color - начнем с определения, которое частично уже написали выше:

Color - это свойство, которое отвечает за цвет.

Синтаксис color

color: цвет | inherit

Значения color

См. цвет

inherit - Наследует значение родителя.

color можно использовать тремя способами :

color в атрибуте attribute style

color в теге style

color и файле file css

Пример использования color

color в атрибуте attribute style

<div style="color:red">Пример color внутри атрибута style</div>

См. подробнее...


color в теге style

См. подробнее...


color и файле file css

См. подробнее...




Пример color в атрибуте attribute style:

Чтобы разобрать работу свойства color нам понадобится пример!

Для примера возьмем какой-то из тег-ов, пусть это будет блочный элемент - div

<div> </div>

Внутрь поместим атрибут style с color = red:

style="color:red"

И нам понадобится еще и текст, чтобы мы смогли увидеть работу свойства color

Пример color внутри атрибута style

Соберем весь код вместе:

<div style="color:red">Пример color внутри атрибута style</div>

Результат применения color внутри атрибута:

Пример color внутри атрибута style

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




Пример color в теге style

Следующий способ применения color в теге {style}, чтобы разобраться в этом заголовке, нам потребуется:

Пусть это будет другой тег -сейчас возьмем строчный тег span :

<span> </span>

Во внутрь данного тега помещаем либо class либо id

И нам нужно ещё какое-то значение класса "example_color_css":

class="example_color_css"

Далее нам потребуется тег style.

<style> </style>

Внутри тега пропишем свойства color для класса "example_color_css", как вы знаете, для обозначения класса применяется точка :

.example_color_css {color : green}

Соберем весь код вместе :

<style>.example_color_css {color : green} </style>

<span class="example_color_css">Здесь текст со свойством color</span>

Пример использования color в теге style

Здесь текст со свойством color

Данный способ применяется для повторяющихся элементов на одной странице.




Пример color в файле css

Как использовать color в файле css ?!

Для этого нам потребуется создать file css.

Прикрепляем . данный файл к сайту

Далее прописываем, как и выше праведном пункте либо class либо id

class="color_css_in_file"

Для класса(color_css_in_file) пропишем color :

.color_css_in_file{color:violet;}

Нам опять нужен какой то тег - повторим тег span :

<span> </span>

У нас получится практически аналогичная запись:

<span class="color_css_in_file">Здесь текст со свойством color </span>

Пример использования color в файле css

Здесь текст со свойством color

Данный способ применяется для создания свойств color на всем сайте