Таблица цвета хтмл: HTML CSS Палитра цветов

Leave a Comment / Разное / By /

Таблица основных цветов CSS

Цвета, выводимые на экране монитора, меняются в зависимости от интенсивности свечения рабочих точек поверхности дисплея, каждая из которых, делает возможным отображение трёх основных каналов: red-красный, green-зеленый и blue-синий.

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

Такой метод передачи цвета называется RGB-способ.

Один канал позволяет передать от 0 до 256 оттенков.

Цвета задаются в шестнадцатеричном коде следующими цифрами:

0 1 2 3 4 5 6 7 8 9 A B C D E F

Цифры с 10 до 15 заменены на латинские буквы.

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

white    #ffffff; белый
black    #000000; чёрный
grey    #bebebe; серый
red    #ff0000; красный
orange    #ffa500; оранжевый
yellow    #ffff00; жёлтый
green    #00ff00; зелёный
cyan    #00ffff; голубой
blue    #0000ff; синий
purple    #a020f0; пурпурный
cream    #fffbf0; кремовый
gold    #ffd700; золотой
chocolate    #d2691e; шоколадный
brown    #a52a2a; коричневый
cornflower blue    #6495ed; васильковый
pink    #ffc0cb; розовый
lime лайм 

HTML

<div>
  white
</div>
  
<div>
  blue
</div>

<div>
  red
</div>



CSS

. box{
    width: 250px;
    font-size: 24px;
    font-weight: bold;
    line-height: 50px;
    margin: 0px auto;
    padding: 3px 20px;
    text-align: center;
}
.red{
    color: #fff;
    background-color: #d52b1e;
}
.blue{
    color: #fff;
    background-color: #0039a6;
}
.white{
    color: #818181;
    background-color: #fff;
}

Таблица кодов безопасных цветов HTML и CSS

Компьютер

Таблица кодов безопасных цветов предназначена для перевода цвета, который вы подобрали, в RGB код (для создания цвета в графическом редакторе) и HEX код (для обозначения цвета в HTML). Цвета html представлены шестью символами, обозначающими доли красного, зеленого и синего цветов в конечном цвете. Известно, что изображение на мониторе компьютера формируется из огромного числа точек — пикселей. Каждый пиксель представляет источник света, состоящий из красного, зеленого и синего цветов. Чтобы получить необходимый цвет, следует увеличить либо уменьшить интенсивность свечения этих цветов. Палитра «безопасных» цветов обеспечивает правильную передачу цвета на разных типах мониторов, компьютеров и браузеров. Надеемся, это поможет вам при редактировании внешнего вида, генерации расцветок своего сайта.

Формат кодов HEX /HTML.
Цвет в формате HEX — это шестнадцатеричное представление RGB. Каждый код HTML представлен в виде 6 букв или цифр. Первые 2 символа в коде HTML означают насыщенность красного цвета; 3-й и 4-й символы — насыщенность зеленого, а 5-й и 6-й — насыщенность синего цвета. Все значения расположены между 00 и FF. Символы 00 означают наименее насыщенный цвет, FF — максимально насыщенный.

Цветовое пространство RGB состоит из множества всевозможных цветов, полученных путем комбинирования разных по насыщенности оттенков красного, зеленого и синего цветов.

255. 255.204255.255.153255.255.102255.255.51255.255.0204.204.0
FFFFCCFFFF99FFFF66FFFF33FFFF00CCCC00
255.204.102255.204.0255.204.51204.153.0204.153.51153.102.0
FFCC66FFCC00FFCC33CC9900CC9933996600
255.153.0255.153.51204.153.102204.102.0153.102.51102. 51.0
FF9900FF9933CC9966CC6600996633663300
255.204.153255.153.102255.102.0204.102.51153.51.0102.0.0
FFCC99FF9966FF6600CC6633993300660000
255.102.51204.51.0255.51.0255.0.0204.0.0153.0.0
FF6633CC3300FF3300FF0000CC0000990000
255. 204.204255.153.153255.102.102255.51.51255.0.51204.0.51
FFCCCCFF9999FF6666FF3333FF0033CC0033
204.153.153204.102.102204.51.51153.51.51153.0.5151.0.0
CC9999CC6666CC3333993333990033330000
255.102.153255.51.102255.0.102204.51.102153.102.102102. 51.51
FF6699FF3366FF0066CC3366996666663333
255.153.204255.51.153255.0.153204.0.102153.51.102102.0.51
FF99CCFF3399FF0099CC0066993366660033
255.102.204255.0.204255.51.204204.102.153204.0.153153.0.102
FF66CCFF00CCFF33CCCC6699CC0099990066
255. 204.255255.153.255255.102.255255.51.255255.0.255204.51.153
FFCCFFFF99FFFF66FFFF33FFFF00FFCC3399
204.153.204204.102.204204.0.204204.51.204153.0.153153.51.153
CC99CCCC66CCCC00CCCC33CC990099993399
204.102.255204.51.255204.0.255153.0.204153.102.153102. 0.102
CC66FFCC33FFCC00FF9900CC996699660066
204.153.255153.51.204153.51.255153.0.255102.0.153102.51.102
CC99FF9933CC9933FF9900FF660099663366
153.102.204153.102.255102.0.204102.51.204102.51.15351.0.51
9966CC9966FF6600CC6633CC663399330033
204. 204.255153.153.255102.51.255102.0.25551.0.15351.0.102
CCCCFF9999FF6633FF6600FF330099330066
153.153.204102.102.255102.102.204102.102.15351.51.15351.51.102
9999CC6666FF6666CC666699333399333366
51.51.25551.0.25551.0.20451.51.2040.0.1530.0.102
3333FF3300FF3300CC3333CC000099000066
102. 153.25551.102.2550.0.2550.0.2040.51.2040.0.51
6699FF3366FF0000FF0000CC0033CC000033
0.102.2550.102.20451.102.2040.51.2550.51.1530.51.102
0066FF0066CC3366CC0033FF003399003366
153.204.25551.153.2550.153.255102.153.20451.102.1530.102.153
99CCFF3399FF0099FF6699CC336699006699
102. 204.25551.204.2550.204.25551.153.2040.153.2040.51.51
66CCFF33CCFF00CCFF3399CC0099CC003333
153.204.204102.204.20451.153.153102.153.1530.102.10251.102.102
99CCCC66CCCC339999669999006666336666
204.255.255153.255.255102.255.25551.255.2550.255.2550. 204.204
CCFFFF99FFFF66FFFF33FFFF00FFFF00CCCC
153.255.204102.255.20451.255.2040.255.20451.204.2040.153.153
99FFCC66FFCC33FFCC00FFCC33CCCC009999
102.204.15351.204.1530.204.15351.153.1020.153.1020.102.51
66CC9933CC9900CC99339966009966006633
102. 255.15351.255.1530.255.15351.204.1020.204.1020.153.51
66FF9933FF9900FF9933CC6600CC66009933
153.255.153102.255.10251.255.1020.255.10251.153.510.102.0
99FF9966FF6633FF6600FF66339933006600
204.255.204153.204.153102.204.102102.153.10251.102.510. 51.0
CCFFCC99CC9966CC66669966336633003300
51.255.510.255.510.255.00.204.051.204.510.204.51
33FF3300FF3300FF0000CC0033CC3300CC33
102.255.0102.255.5151.255.051.204.051.153.00.153.0
66FF0066FF3333FF0033CC00339900009900
204. 255.153153.255.102102.204.0102.204.51102.153.5151.102.0
CCFF9999FF6666CC0066CC33669933336600
153.255.0153.255.51153.204.102153.204.0153.204.51102.153.0
99FF0099FF3399CC6699CC0099CC33669900
204.255.102204.255.0204.255.51204.204.153102.102.5151. 51.0
CCFF66CCFF00CCFF33CCCC99666633333300
204.204.102204.204.51153.153.102153.153.51153.153.0102.102.0
CCCC66CCCC33999966999933999900666600
255.255.255204.204.204153.153.153102.102.10251.51.510.0.0
FFFFFFCCCCCC999999666666333333000000

Предыдущая Определить свой IP адрес

Следующая Время загрузки файла

Цвет фона таблицы HTML

Эта страница содержит код цвета фона таблицы HTML. Это HTML-коды для указания или изменения цвета фона ваших таблиц в вашем блоге или на веб-странице.

В HTML цвет фона таблицы задается с помощью каскадных таблиц стилей (CSS). В частности, вы используете свойство CSS background-color , чтобы установить цвет фона для вашей таблицы. Вы также можете указать отдельный цвет фона для строк и ячеек таблицы, если хотите.

Цвет фона для всей таблицы

Чтобы изменить цвет фона всей таблицы, используйте свойство background-color против тега table .

<таблица>Заголовок таблицыЗаголовок таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицы

Цвет фона строки таблицы

Чтобы изменить цвет фона строки таблицы, вы применяете тот же код, но к соответствующей строке таблицы (т.е. тег tr ).

Здесь мы также используем border-collapse:collapse; , чтобы свернуть границу.

<таблица>Заголовок таблицыЗаголовок таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицы

Цвет фона отдельной ячейки

Чтобы изменить цвет фона отдельной ячейки таблицы, вы применяете тот же код, но к соответствующей ячейке таблицы (т. е. тегу td или тегу th , в зависимости от того, является ли ячейка обычной строкой данных таблицы). или часть заголовка таблицы).

<таблица>Заголовок таблицыЗаголовок таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицы

Использование классов

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

Вот пример установки цвета фона таблицы и других свойств с помощью класса CSS.

<голова>Пример <стиль> .myTable { ширина: 100%; выравнивание текста: по левому краю; цвет фона: лимонный шифон; граница коллапса: коллапс; } .myTable { цвет фона: золотарник; белый цвет; } .myTable тд, .myTable { отступ: 10 пикселей; граница: сплошной золотарник 1px; } <тело> <таблица>ЗаголовокЗаголовокЯчейка таблицыЯчейка таблицыЯчейка таблицыЯчейка таблицы

Раскрашивание HTML-таблиц с помощью стилей CSS

Как раскрасить таблицу с помощью CSS

В предыдущей главе рассказывалось, как изменить основные стили таблицы с помощью CSS. В этой главе мы собираемся добавить больше стилей к таблицам с помощью CSS. Как только вы создадите структуру таблицы в разметке, легко добавить слой стиля, чтобы настроить ее внешний вид.

Цвет фона таблицы CSS

Свойство CSS background-color позволяет окрашивать фон таблицы, строки и ячеек.

тр { цвет фона: зеленый; белый цвет; }

Приведенный выше код окрашивает фон каждой строки в зеленый цвет, а цвет переднего плана — в белый.


Исходный код
Рулон № Имя Команда
1001 Джон Красный
1002 Питер Синий
1003 Генри Зеленый

Как раскрасить определенную строку в таблице CSS

Вы можете использовать tr:nth-child(rownumber) для окрашивания определенной строки в таблице с помощью CSS.

tr: n-й ребенок (3) { цвет фона: зеленый; белый цвет; }

Над кодом выберите 3 строки сверху (включая строку заголовка таблицы) и закрасьте фон зеленым, а передний план белым.


Код CSS

Применил этот код CSS к HTML-таблице примера 1

Как раскрасить определенный столбец в таблице CSS

Вы можете задать цвет фона для определенного столбца, подав иск td:nth-child(номер_столбца) .

td: n-й ребенок (1) { цвет фона: оранжевый; }

Приведенный выше код окрашивает цвет фона первого столбца в оранжевый.


Код CSS

Применил этот код CSS к HTML-таблице примера 1

Как раскрасить только ячейку таблицы CSS

В следующем исходном коде показано, как раскрасить конкретную ячейку в таблице с помощью CSS.

Рулон № Имя Команда
1001 Джон Красный
1002 Питер Синий
1003 Генри Зеленый

Таблица CSS Альтернативное окрашивание строк

Вы можете использовать tr:nth-child(rowOrder), чтобы придать таблице чередующийся цвет строк с помощью CSS.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *