Основы работы с CSS

         

Межплатформенных цветов


Эта палитра из 216 межплатформенных безопасных для Web цветов была первоначально создана для обеспечения правильного вывода компьютерами всех цветов при использовании палитры из 256 цветов.

0000000000330000660000990000CC 0000FF
0033000033330033660033990033CC0033FF
0066000066330066660066990066CC0066FF
0099000099330099660099990099CC0099FF
00CC0000CC3300CC6600CC9900CCCC00CCFF
00FF0000FF3300FF6600FF9900FFCC00FFFF
3300003300333300663300993300CC3300FF
3333003333333333663333993333CC3333FF
3366003366333366663366993366CC3366FF
3399003399333399663399993399CC3399FF
33CC0033CC3333CC6633CC9933CCCC33CCFF
33FF0033FF3333FF6633FF9933FFCC33FFFF
6600006600336600666600996600CC6600FF
6633006633336633666633996633CC6633FF
6666006666336666666666996666CC6666FF
6699006699336699666699996699CC6699FF
66CC0066CC3366CC6666CC9966CCCC66CCFF
66FF0066FF3366FF6666FF9966FFCC66FFFF
9900009900339900669900999900CC9900FF
9933009933339933669933999933CC9933FF
9966009966339966669966999966CC9966FF
9999009999339999669999999999CC9999FF
99CC0099CC3399CC6699CC9999CCCC99CCFF
99FF0099FF3399FF6699FF9999FFCC99FFFF
CC0000CC0033CC0066CC0099CC00CCCC00FF
CC3300CC3333CC3366CC3399CC33CCCC33FF
CC6600CC6633CC6666CC6699CC66CCCC66FF
CC9900CC9933CC9966CC9999CC99CCCC99FF
CCCC00CCCC33CCCC66CCCC99CCCCCCCCCCFF
CCFF00CCFF33CCFF66CCFF99CCFFCCCCFFFF
FF0000FF0033FF0066FF0099FF00CCFF00FF
FF3300FF3333FF3366FF3399FF33CCFF33FF
FF6600FF6633FF6666FF6699FF66CCFF66FF
FF9900FF9933FF9966FF9999FF99CCFF99FF
FFCC00FFCC33FFCC66FFCC99FFCCCCFFCCFF
FFFF00FFFF33FFFF66FFFF99FFFFCCFFFFFF



Различных цветов


Большинство современных мониторов способны выводить как минимум 16384 различных цветов.

Если взглянуть на таблицу цветов, расположенную ниже, то можно увидеть результат изменения интенсивности красного цвета от 0 до 255, при значениях зеленого и синего цветов равных нулю.

Красный цвет HEX RGB
#080000rgb(8,0,0)
#100000rgb(16,0,0)
#180000rgb(24,0,0)
#200000rgb(32,0,0)
#280000rgb(40,0,0)
#300000rgb(48,0,0)
#380000rgb(56,0,0)
#400000rgb(64,0,0)
#480000rgb(72,0,0)
#500000rgb(80,0,0)
#580000rgb(88,0,0)
#600000rgb(96,0,0)
#680000rgb(104,0,0)
#700000rgb(112,0,0)
#780000rgb(120,0,0)
#800000rgb(128,0,0)
#880000rgb(136,0,0)
#900000rgb(144,0,0)
#980000rgb(152,0,0)
#A00000rgb(160,0,0)
#A80000rgb(168,0,0)
#B00000rgb(176,0,0)
#B80000rgb(184,0,0)
#C00000rgb(192,0,0)
#C80000rgb(200,0,0)
#D00000rgb(208,0,0)
#D80000rgb(216,0,0)
#E00000rgb(224,0,0)
#E80000rgb(232,0,0)
#F00000rgb(240,0,0)
#F80000rgb(248,0,0)
#FF0000rgb(255,0,0)



Безопасные цвета Web


Несколько лет назад, когда большинство компьютеров поддерживали только 256 различных цветов, был предложен в качестве стандарта Web список из 216 безопасных цветов Web. Причина этого состояла в том, что операционные системы Microsoft и Mac использовали 40 различных "резервных" фиксированных системных цветов (около 20 каждая).

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



Названия цветов


Некоторая совокупность названий цветов поддерживается большинством браузеров.

Примечание: Только 16 названий цветов поддерживается стандартом W3C для CSS (aqua (голубой), black (черный), blue (синий), fuchsia (фуксия), gray (серый), green (зеленый), lime (лайм), maroon (темно-бордовый), navy (темно-синий), olive (оливковый), purple (сиреневый), red (красный), silver (светло-серый), teal (сине-зеленый), white (белый), и yellow (желтый)). Для всех других цветов необходимо использовать значение HEX цвета.

Цвет Цвет (HEX) Название цвета
#FFF8DC Cornsilk (кукурузные рыльца)
#00008B DarkBlue (темно-синий)
#008B8B DarkCyan (темно-голубой)
#FFFFF0 Ivory (слоновая кость)
#FFFFE0 LightYellow (светло-желтый)
#FFA500 Orange (оранжевый)
#4169E1 RoyalBlue (ярко-синий)



Названия цветов в CSS


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

Примечание: Стандарт CSS консорциума W3C поддерживает только 16 имен цветов (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow). Для всех остальных цветов необходимо использовать HEX (шестнадцатеричное) значение цвета.

Название цвета HEX цвета Цвет
AliceBlue (бледно-голубой) #F0F8FF
AntiqueWhite (античный белый) #FAEBD7
Aqua (голубой) #00FFFF
Aquamarine (аквамарин) #7FFFD4
Azure (лазурный) #F0FFFF
Beige (беж) #F5F5DC
Bisque (бисквитный) #FFE4C4
Black (черный) #000000
BlanchedAlmond (светло-кремовый) #FFEBCD
Blue (синий)#0000FF
BlueViolet (сине-фиолетовый) #8A2BE2
Brown (коричневый) #A52A2A
BurlyWood (старое дерево) #DEB887
CadetBlue (серо-голубой) #5F9EA0
Chartreuse (зеленовато-желтый) #7FFF00
Chocolate (шоколадный) #D2691E
Coral (коралловый) #FF7F50
CornflowerBlue (васильковый) #6495ED
Cornsilk (кукурузные рыльца) #FFF8DC
Crimson (малиновый) #DC143C
Cyan (светло-голубой) #00FFFF
DarkBlue (темно-синий) #00008B
DarkCyan (темно-голубой) #008B8B
DarkGoldenRod (темно-золотисто-коричневый) #B8860B
DarkGray (темно-серый) #A9A9A9
DarkGreen (темно-зеленый) #006400
DarkKhaki (темный хаки) #BDB76B
DarkMagenta (темно-пурпурный) #8B008B
DarkOliveGreen (темно-оливково-зеленый) #556B2F
Darkorange (темно-оранжевый) #FF8C00
DarkOrchid (темно-лиловый) #9932CC
DarkRed (темно-красный) #8B0000
DarkSalmon (темно-оранжево-розовый) #E9967A
DarkSeaGreen (темно-зеленое море) #8FBC8F
DarkSlateBlue (темный серовато-синий) #483D8B
DarkSlateGray (темный синевато-серый) #2F4F4F
DarkTurquoise (темно-бирюзовый) #00CED1
DarkViolet (темно-фиолетовый)#9400D3
DeepPink (темно-розовый) #FF1493
DeepSkyBlue (темно-небесно-голубой) #00BFFF
DimGray (тускло-серый) #696969
DodgerBlue (тускло-васильковый) #1E90FF
Feldspar (полевой шпат) #D19275
FireBrick (огнеупорный кирпич) #B22222
FloralWhite (цветочно-белый) #FFFAF0
ForestGreen (лесная зелень) #228B22
Fuchsia (фуксия) #FF00FF
Gainsboro (светло-серый) #DCDCDC
GhostWhite (туманно-белый) #F8F8FF
Gold (золотой) #FFD700
GoldenRod (золотисто-коричневый) #DAA520
Gray (серый) #808080
Green (зеленый) #008000
GreenYellow (зелено-желтый) #ADFF2F
HoneyDew (медовая роса) #F0FFF0
HotPink (ярко-розовый) #FF69B4
IndianRed (индийский-красный) #CD5C5C
Indigo (индиго) #4B0082
Ivory (слоновая кость) #FFFFF0
Khaki (хаки) #F0E68C
Lavender (бледно-лиловый) #E6E6FA
LavenderBlush (бледный розово-лиловый) #FFF0F5
LawnGreen (зеленая трава) #7CFC00
LemonChiffon (лимонный) #FFFACD
LightBlue (светло-синий) #ADD8E6
LightCoral (светло-коралловый) #F08080
LightCyan (светло-светло-голубой) #E0FFFF
LightGoldenRodYellow (светлый коричнево-желтый) #FAFAD2
LightGrey (светло-серый) #D3D3D3
LightGreen (светло-зеленый) #90EE90
LightPink (светло-розовый) #FFB6C1
LightSalmon (светлый оранжево-розовый) #FFA07A
LightSeaGreen (светло-зеленое море) #20B2AA
LightSkyBlue (светло-небесно-голубой) #87CEFA
LightSlateBlue (светлый серовато-синий) #8470FF
LightSlateGray (светлый синевато-серый) #778899
LightSteelBlue (светлый голубовато стальной) #B0C4DE
LightYellow (светло-желтый) #FFFFE0
Lime (лайм) #00FF00
LimeGreen (зеленый лайм) #32CD32
Linen (льняной) #FAF0E6
Magenta (пурпурный) #FF00FF
Maroon (каштановый) #800000
MediumAquaMarine (умеренно аквамариновый) #66CDAA
MediumBlue (умеренно синий) #0000CD
MediumOrchid (умеренно лиловый) #BA55D3
MediumPurple (умеренно пурпурный) #9370D8
MediumSeaGreen (умеренно-зеленое море) #3CB371
MediumSlateBlue (умеренно серовато-синий) #7B68EE
MediumSpringGreen (умеренная весенняя зелень) #00FA9A
MediumTurquoise (умеренно-бирюзовый) #48D1CC
MediumVioletRed (умеренно фиолетово красный) #C71585
MidnightBlue (ночной синий) #191970
MintCream (мятно-кремовый) #F5FFFA
MistyRose (туманно-розовый) #FFE4E1
Moccasin (песочный)#FFE4B5
NavajoWhite (темно-песочный) #FFDEAD
Navy (темно-синий) #000080
OldLace (старые кружева) #FDF5E6
Olive (оливковый) #808000
OliveDrab (тускло-оливковый) #6B8E23
Orange (оранжевый) #FFA500
OrangeRed (оранжево-красный) #FF4500
Orchid (лиловый) #DA70D6
PaleGoldenRod (бледно-золотисто-коричневый) #EEE8AA
PaleGreen (бледно-зеленый) #98FB98
PaleTurquoise (бледно-голубой) #AFEEEE
PaleVioletRed (бледно-фиолетово-красный) #D87093
PapayaWhip (дыни) #FFEFD5
PeachPuff (персиковый) #FFDAB9
Peru (коричневый) #CD853F
Pink (розовый) #FFC0CB
Plum (сливовый) #DDA0DD
PowderBlue (туманно-голубой)#B0E0E6
Purple (пурпурный) #800080
Red (красный) #FF0000
RosyBrown (розово-коричневый)#BC8F8F
RoyalBlue (ярко-синий) #4169E1
SaddleBrown (старая кожа) #8B4513
Salmon (оранжево-розовый) #FA8072
SandyBrown (песочно-коричневый) #F4A460
SeaGreen (зеленое море) #2E8B57
SeaShell (морская ракушка) #FFF5EE
Sienna (охра) #A0522D
Silver (свето-серый) #C0C0C0
SkyBlue (небесно-голубой) #87CEEB
SlateBlue (серовато-синий) #6A5ACD
SlateGray (синевато-серый) #708090
Snow (снежный) #FFFAFA
SpringGreen (весенняя зелень) #00FF7F
SteelBlue (сине-стальной) #4682B4
Tan (бронзы) #D2B48C
Teal (сине-зеленый) #008080
Thistle (чертополох) #D8BFD8
Tomato (томат) #FF6347
Turquoise (бирюзовый) #40E0D0
Violet (фиолетовый) #EE82EE
VioletRed (фиолетово-красный) #D02090
Wheat (пшеничный) #F5DEB3
White (белый) #FFFFFF
WhiteSmoke (белый дым) #F5F5F5
Yellow (желтый) #FFFF00
YellowGreen (желто-зеленый) #9ACD32



Оттенки серого цвета




Серые цвета выводятся при равных значениях интенсивности всех трех источников света. Чтобы облегчить выбор правильного серого цвета ниже представлена таблица оттенков серого цвета:

Серый цвет RGB HEX
RGB(0,0,0) #000000
RGB(8,8,8) #080808
RGB(16,16,16) #101010
RGB(24,24,24) #181818
RGB(32,32,32) #202020
RGB(40,40,40) #282828
RGB(48,48,48) #303030
RGB(56,56,56) #383838
RGB(64,64,64) #404040
RGB(72,72,72) #484848
RGB(80,80,80) #505050
RGB(88,88,88) #585858
RGB(96,96,96) #606060
RGB(104,104,104) #686868
RGB(112,112,112) #707070
RGB(120,120,120) #787878
RGB(128,128,128) #808080
RGB(136,136,136) #888888
RGB(144,144,144) #909090
RGB(152,152,152) #989898
RGB(160,160,160) #A0A0A0
RGB(168,168,168) #A8A8A8
RGB(176,176,176) #B0B0B0
RGB(184,184,184) #B8B8B8
RGB(192,192,192) #C0C0C0
RGB(200,200,200) #C8C8C8
RGB(208,208,208) #D0D0D0
RGB(216,216,216) #D8D8D8
RGB(224,224,224) #E0E0E0
RGB(232,232,232) #E8E8E8
RGB(240,240,240) #F0F0F0
RGB(248,248,248) #F8F8F8
RGB(255,255,255) #FFFFFF



Значения цветов


Цвета в CSS определяют с помощью шестнадцатеричной записи комбинации значений красного, зеленого и синего цветов (RGB). Наименьшее значение, которое можно задать одному из источников равно 0 (hex #00), а максимальное - 255 (hex #FF).

Следующая таблица показывает результат объединения источников красного (R), зеленого (G) и синего (B) источников цвета:

Цвет Цвет (HEX) Цвет RGB
#000000 rgb(0,0,0)
#FF0000 rgb(255,0,0)
#00FF00 rgb(0,255,0)
#0000FF rgb(0,0,255)
#FFFF00 rgb(255,255,0)
#00FFFF rgb(0,255,255)
#FF00FF rgb(255,0,255)
#C0C0C0 rgb(192,192,192)
#FFFFFF rgb(255,255,255)