мета-данные страницы
  •  
Загрузка не удалась. Возможно, проблемы с правами доступа?

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слеваПредыдущая версия
Следующая версия		Предыдущая версия
html:css [20/04/2010 11:20] – pdemenkovhtml:css [21/04/2010 17:12] (текущий) – dnaumov
Строка 5: Строка 5:
 CSS-код – это список инструкций для браузера, – как и где отображать элементы веб-страницы, написанный особым образом. Под «элементами» обычно подразумеваются теги XHTML/HTML и их содержимое. CSS-код – это список инструкций для браузера, – как и где отображать элементы веб-страницы, написанный особым образом. Под «элементами» обычно подразумеваются теги XHTML/HTML и их содержимое.
  
-Инструкции CSS удобно хранить в виде отдельного текстового файла с расширением ".css", либо в виде отдельного текстового фрагмента в начале XHTML/HTML-документа (см. Включение CSS в HTML документ).+Инструкции CSS удобно хранить в виде отдельного текстового файла с расширением «.css», либо в виде отдельного текстового фрагмента в начале XHTML/HTML-документа (см. Включение CSS в HTML документ).
  
 Основная идея CSS в том, чтобы отделить дизайн документа от его содержимого. CSS отвечает за оформление и внешний вид, а XHTML/HTML — за содержание и логическую структуру документа. Основная идея CSS в том, чтобы отделить дизайн документа от его содержимого. CSS отвечает за оформление и внешний вид, а XHTML/HTML — за содержание и логическую структуру документа.
  
 Посмотрим на фрагмент XHTML-документа: Посмотрим на фрагмент XHTML-документа:
-<code>+<code html>
 <h1>Сказка про Красную Шапочку</h1> <h1>Сказка про Красную Шапочку</h1>
 <p>Жила однажды в далекой деревушке маленькая прелестная девочка. …</p> <p>Жила однажды в далекой деревушке маленькая прелестная девочка. …</p>
 </code> </code>
  
-Из служебной XHTML разметки мы видим только элемент заголовка h1  и абзаца p, и ни слова об оформлении — шрифтах, цвете текста, фоне, отступах и прочем дизайне. Всё это возложено на CSS:+Из служебной XHTML разметки мы видим только элемент заголовка [[:html:tags:h|h1]]  и абзаца [[:html:tags:p|p]], и ни слова об оформлении — шрифтах, цвете текста, фоне, отступах и прочем дизайне. Всё это возложено на CSS:
  
-<code>+<code css>
 /* оформляем заголовки: */ /* оформляем заголовки: */
 h1 { h1 {
Строка 34: Строка 34:
 Для того, чтобы применить таблицу стилей  к HTML-документу, мы можем избрать один из трёх способов, либо комбинировать их: Для того, чтобы применить таблицу стилей  к HTML-документу, мы можем избрать один из трёх способов, либо комбинировать их:
  
-    * применить внешние стили (в виде отдельного текстового .css-файла) с помощью элемента link +    * применить внешние стили (в виде отдельного текстового .css-файла) с помощью элемента [[:html:tags:link|link]] 
-    * встроить стили непосредственно в HTML-документ (в виде блока css-текста) с помощью элемента style+    * встроить стили непосредственно в HTML-документ (в виде блока css-текста) с помощью элемента [[:html:tags:style|style]]
     * применить inline-стиль, то есть назначить стиль конкретному HTML-элементу непосредственно в документе, с помощью HTML-атрибута style     * применить inline-стиль, то есть назначить стиль конкретному HTML-элементу непосредственно в документе, с помощью HTML-атрибута style
  
Строка 41: Строка 41:
  
 ===== Внешние стили (external style sheets) ===== ===== Внешние стили (external style sheets) =====
-Применяются с помощью элемента link, который должен располагаться внутри элемента head и нигде более. +Применяются с помощью элемента link, который должен располагаться внутри элемента [[:html:tags:head|head]] и нигде более. 
-<code>+<code html>
 <link rel=”stylesheet” type=”text/css” href=”mystyle.css” media=”all” /> <link rel=”stylesheet” type=”text/css” href=”mystyle.css” media=”all” />
 </code> </code>
Строка 48: Строка 48:
 Встретив в HTML-документе этот тег, браузер загрузит с сайта CSS-файл (в нашем случае это mystyle.css) и применит к документу содержащиеся в нём стили. Файл не должен содержать ничего, кроме CSS-инструкций. Встретив в HTML-документе этот тег, браузер загрузит с сайта CSS-файл (в нашем случае это mystyle.css) и применит к документу содержащиеся в нём стили. Файл не должен содержать ничего, кроме CSS-инструкций.
  
-Внешний файл со стилями удобен тем, что одни и те же стили можно применять ко множеству документов на сайте — в каждом из них достаточно лишь вписать одну строку с элементом link.+Внешний файл со стилями удобен тем, что одни и те же стили можно применять ко множеству документов на сайте — в каждом из них достаточно лишь вписать одну строку с элементом [[:html:tags:link|link]].
  
 ===== Таблицы стилей документа (document style sheets) ===== ===== Таблицы стилей документа (document style sheets) =====
Строка 54: Строка 54:
 Называются так потому, что располагаются непосредственно в HTML-документе и применяются только к нему. Иногда называются embedded style sheet (встроенный стиль). Называются так потому, что располагаются непосредственно в HTML-документе и применяются только к нему. Иногда называются embedded style sheet (встроенный стиль).
  
-CSS-стили и комментарии располагаются между открывающим и закрывающим тегами элемента style: +CSS-стили и комментарии располагаются между открывающим и закрывающим тегами элемента [[:html:tags:style|style]]: 
-<code>+<code html>
 <style type=”text/css”> <style type=”text/css”>
 ... ...
Строка 61: Строка 61:
 </code> </code>
  
-Сам тег style (в отличие от link) может находиться в любой части документа, но обычно его размещают внутри элемента head.+Сам тег [[:html:tags:style|style]] (в отличие от [[:html:tags:link|link]]) может находиться в любой части документа, но обычно его размещают внутри элемента [[:html:tags:head|head]].
 Стили, подставляемые в строку (inline styles) Стили, подставляемые в строку (inline styles)
  
-Иногда нужно назначить стиль отдельному элементу на странице, не применяя внешних стилей и элемента style. Типичный случай — элемент встречается единожды в документе или на сайте, но требует особого оформления. Воспользуемся атрибутом style (именно атрибутом элементов, а не элементом!): +Иногда нужно назначить стиль отдельному элементу на странице, не применяя внешних стилей и элемента [[:html:tags:style|style]]. Типичный случай — элемент встречается единожды в документе или на сайте, но требует особого оформления. Воспользуемся атрибутом style (именно атрибутом элементов, а не элементом!): 
-<code>+<code html>
 <p style=”color: red”>Я абзац, выделенный красным цветом, других таких на сайте нет</p> <p style=”color: red”>Я абзац, выделенный красным цветом, других таких на сайте нет</p>
 </code> </code>
  
-Атрибут style есть почти у всех HTML-элементов. Кроме тех, что располагаются вне элемента body.+Атрибут style есть почти у всех HTML-элементов. Кроме тех, что располагаются вне элемента [[:html:tags:body|body]].
  
 Внутри атрибута style можно написать несколько CSS объявлений, разделённых точкой с запятой, фигурные скобки не используются. Внутри атрибута style можно написать несколько CSS объявлений, разделённых точкой с запятой, фигурные скобки не используются.
Строка 85: Строка 85:
 Как это может выглядеть на практике? Вот три примера CSS-правил: Как это может выглядеть на практике? Вот три примера CSS-правил:
  
-<code>+<code css>
 a {text-decoration: none;} a {text-decoration: none;}
  
Строка 107: Строка 107:
 ===== HTML селекторы ===== ===== HTML селекторы =====
  
-Это простейший случай – в качестве селектора мы используем имя того html-элемента, который хотим изменить. Например, для тега <strong> селектором будет strong. Соответственно, для тега <code> +Это простейший случай – в качестве селектора мы используем имя того html-элемента, который хотим изменить. Например, для тега [[:html:tags:strong|<strong>]] селектором будет strong. Соответственно, для тега [[:html:tags:h1|<h1>]] селектором будет h1, и так далее. Теперь мы можем переопределить внешний вид всех таких элементов в нашем документе: 
-<h1> селектором будет h1, и так далее. Теперь мы можем переопределить внешний вид всех таких элементов в нашем документе:+ 
 +<code css>
 strong {font-weight: normal; color: red;} strong {font-weight: normal; color: red;}
 h1 { font: bold 10pt verdana; } h1 { font: bold 10pt verdana; }
Строка 119: Строка 120:
 {{:html:css:selector_class.gif|}} {{:html:css:selector_class.gif|}}
  
-<code>+<code css>
 .myClass { font: bold 10pt verdana; } /* меняем шрифт для всех тегов с классом myClass */ .myClass { font: bold 10pt verdana; } /* меняем шрифт для всех тегов с классом myClass */
 </code> </code>
Строка 129: Строка 130:
 {{:html:css:selector_id.gif|}} {{:html:css:selector_id.gif|}}
  
-<code>+<code css>
 #myObj { margin: 1em; } /* изменяем поля для элемента, у которого id=”myObj” */ #myObj { margin: 1em; } /* изменяем поля для элемента, у которого id=”myObj” */
 span#today { margin: 1em; } /* изменяем поля для элемента span, у которого id=”today” */ span#today { margin: 1em; } /* изменяем поля для элемента span, у которого id=”today” */
Строка 141: Строка 142:
 Впоследствии оформление для селекторов можно переопределить индивидуально: Впоследствии оформление для селекторов можно переопределить индивидуально:
  
-<code>+<code css>
 /* все параграфы и списки делаем красными, шрифтом Tahoma */ /* все параграфы и списки делаем красными, шрифтом Tahoma */
 p, li, ul, ol {color:red; font-face: Tahoma, sans-serif;} p, li, ul, ol {color:red; font-face: Tahoma, sans-serif;}
Строка 155: Строка 156:
 Вот, посмотрите: Вот, посмотрите:
  
-<code>+<code css>
 /* все ссылки, находящиеся внутри списков, станут красными: */ /* все ссылки, находящиеся внутри списков, станут красными: */
 li a {color: red;} li a {color: red;}
Строка 173: Строка 174:
 {{:html:css:selectors_descendant_0.gif|}} {{:html:css:selectors_descendant_0.gif|}}
  
-В приведённом примере мы вроде бы создали список селекторов, разделённый пробелами. На самом деле это один селектор потомков. Он указывает на все гиперссылки (элементы A) вложенные в списки (элементы LI), в свою очередь находящиеся внутри элемента с идентификатором footer. У всех таких гиперссылок мы меняем толщину шрифта на bold (полужирный шрифт).+В приведённом примере мы вроде бы создали список селекторов, разделённый пробелами. На самом деле это один селектор потомков. Он указывает на все гиперссылки (элементы [[:html:tags:a|A]]) вложенные в списки (элементы [[:html:tags:li|LI]]), в свою очередь находящиеся внутри элемента с идентификатором footer. У всех таких гиперссылок мы меняем толщину шрифта на bold (полужирный шрифт).
  
 ===== Селекторы детей ===== ===== Селекторы детей =====
Строка 183: Строка 184:
 {{:html:css:selectors_child.gif|}} {{:html:css:selectors_child.gif|}}
  
-В приведённом примере мы находим все элементы B, вложенные непосредственно в элементы I, и выключаем для них полужирный шрифт. Все остальные элементы B в документе останутся без изменений.+В приведённом примере мы находим все элементы [[:html:tags:b|B]], вложенные непосредственно в элементы [[:html:tags:i|I]], и выключаем для них полужирный шрифт. Все остальные элементы [[:html:tags:b|B]] в документе останутся без изменений.
  
 ===== Селекторы смежных элементов (Adjacent Sibling Selectors) ===== ===== Селекторы смежных элементов (Adjacent Sibling Selectors) =====
  
  
-Иногда нам надо выбрать элемент, расположенный в HTML-документе непосредственно за другим элементом. Так, например, чтобы выбрать все заголовки H1, следующие за параграфами P, и изменить их верхний отступ, мы напишем следующее правило CSS:+Иногда нам надо выбрать элемент, расположенный в HTML-документе непосредственно за другим элементом. Так, например, чтобы выбрать все заголовки [[:html:tags:h1|H1]], следующие за параграфами [[:html:tags:p|P]], и изменить их верхний отступ, мы напишем следующее правило CSS:
  
 {{:html:css:selectors_adjacent.gif|}} {{:html:css:selectors_adjacent.gif|}}
 +<note important>
 +**Важно:** будет выбран только первый (!) заголовок [[:html:tags:h1|H1]], расположенный непосредственно после [[:html:tags:p|P]]. Если между элементами [[:html:tags:p|P]] и [[:html:tags:h1|H1]] встретится любой элемент, хоть один (даже если это) – то селектор не сработает и правило не применится.
  
-Важно: будет выбран только первый (!) заголовок H1, расположенный непосредственно после P. Если между элементами P и H1 встретится любой элемент, хоть один (даже если это +**Важно:** селекторы смежных элементов появились в CSS v2 и поддерживаются, увы, не во всех браузерах. В Internet Explorer они появились только с 7-й версии, в Opera – с 5-й версии. 
-) – то селектор не сработает и правило не применится. +</note>
- +
-Важно: селекторы смежных элементов появились в CSS v2 и поддерживаются, увы, не во всех браузерах. В Internet Explorer они появились только с 7-й версии, в Opera – с 5-й версии. +
  
 ====== Обзор свойств CSS ====== ====== Обзор свойств CSS ======
Строка 487: Строка 487:
     * border-style     * border-style
     * border-color     * border-color
- 
-====== Приоритет в каскаде стилей (!important) ====== 
- 
-Объявление !important переводится на русский как !важно. 
- 
-Если к паре свойство - значение приписать объявление !important, тогда это значение CSS-свойства получит максимальный приоритет в каскаде стилей. Проще говоря, это объявление сработает для элемента независимо от наличия других правил CSS для этого же элемента. 
- 
-!important добавляется вот так: 
- 
-{{:html:css:important.gif|}} 
- 
-Внимание! Очень распространённая ошибка – располагать !important после точки с запятой. Браузер игнорирует такие записи. 
- 
- 
-====== Задание цвета в CSS ====== 
- 
-CSS предлагает нам четыре удобных способа указать цвет. 
- 
-    * По имени. Используются англоязычные названия цветов, например blue или red (см. Именованные цвета). 
-    * В шестнадцатиричном RGB (например, #71C354 или #3C9). Этот способ широко используется в HTML (см. Безопасные (browser-safe) цвета в CSS). 
-    * В десятичном формате RGB (например, rgb (126, 6, 9)), где значение каждой компоненты цвета может варьироваться от 0 до 255. 
-    * В формате RGB с указанием величин в процентах, например, rgb (30%, 40%, 70%)), где значение каждой компоненты цвета может варьироваться от 0 до 100. 
- 
-Пример 
-<code> 
-/* Несколько способов сделать параграфы зелеными: */ 
-p {color: lime} 
-p {color: rgb(0,255,0)} 
-p {color: #0f0} 
-p {color: #00ff00} 
-p {color: rgb(0%, 100%, 0%)} 
-</code> 
- 
-В этом примере все способы задания цвета равнозначны и приведут к одному и тому же результату - цвет параграфов станет ярко-зеленым. 
- 
  
 ====== Задание размеров (длина, ширина) в CSS ====== ====== Задание размеров (длина, ширина) в CSS ======
  
-Размеры задаются в числовых значениях - отрицательных и положительных. Допустимы десятичные дроби, дробная часть пишется через знак "." (точка).+Размеры задаются в числовых значениях - отрицательных и положительных. Допустимы десятичные дроби, дробная часть пишется через знак «.» (точка).
  
 Сразу после числа необходимо указать единицу измерения. Сразу после числа необходимо указать единицу измерения.
Строка 549: Строка 514:
  
 Примеры Примеры
-<code>+<code css>
 body {margin: 1in} body {margin: 1in}
 table {padding: 1.5cm} table {padding: 1.5cm}
Строка 568: Строка 533:
 Предположим, мы имеем на входе: Предположим, мы имеем на входе:
  
-<code>+<code html>
 <span>Какой-то контент</span> <span>Какой-то контент</span>
 </code> </code>
Строка 589: Строка 554:
 ===== Блочные (block) элементы ===== ===== Блочные (block) элементы =====
  
-Занимают до 100% ширины родительского элемента. При этом соседним элементам придется подвинуться вниз. Так, например, h1 является блочным элементом - всякий следующий за ним элемент будет отображен ниже.+Занимают до 100% ширины родительского элемента. При этом соседним элементам придется подвинуться вниз. Так, например, [[html:tags:h1|h1]] является блочным элементом - всякий следующий за ним элемент будет отображен ниже.
          
 +
 ===== Inline- ("инлайн"-) элементы ===== ===== Inline- ("инлайн"-) элементы =====
  
Строка 598: Строка 564:
  
 С помощью CSS мы можем переопределять эти правила, влияя на отображение прямоугольников элементов. CSS позволяет задавать свойства, определяющие цвет шрифта, фона и бордюра, стиль и ширину бордюра, ширину полей и отступов и многое-многое другое. С помощью CSS мы можем переопределять эти правила, влияя на отображение прямоугольников элементов. CSS позволяет задавать свойства, определяющие цвет шрифта, фона и бордюра, стиль и ширину бордюра, ширину полей и отступов и многое-многое другое.
 +
 +
 +
 +====== Приоритет в каскаде стилей (!important) ======
 +
 +Объявление !important переводится на русский как !важно.
 +
 +Если к паре свойство - значение приписать объявление !important, тогда это значение CSS-свойства получит максимальный приоритет в каскаде стилей. Проще говоря, это объявление сработает для элемента независимо от наличия других правил CSS для этого же элемента.
 +
 +!important добавляется вот так:
 +
 +{{:html:css:important.gif|}}
 +
 +Внимание! Очень распространённая ошибка – располагать !important после точки с запятой. Браузер игнорирует такие записи.
 +
 +
 +====== Задание цвета в CSS ======
 +
 +CSS предлагает нам четыре удобных способа указать цвет.
 +
 +    * По имени. Используются англоязычные названия цветов, например blue или red (см. [[html:css#imenovannye_cveta|Именованные цвета]]).
 +    * В шестнадцатиричном RGB (например, #71C354 или #3C9). Этот способ широко используется в HTML (см. [[html:css#bezopasnye_browser-safe_cveta_v_css|Безопасные (browser-safe) цвета в CSS]]).
 +    * В десятичном формате RGB (например, rgb (126, 6, 9)), где значение каждой компоненты цвета может варьироваться от 0 до 255.
 +    * В формате RGB с указанием величин в процентах, например, rgb (30%, 40%, 70%)), где значение каждой компоненты цвета может варьироваться от 0 до 100.
 +
 +Пример
 +<code css>
 +/* Несколько способов сделать параграфы зелеными: */
 +p {color: lime}
 +p {color: rgb(0,255,0)}
 +p {color: #0f0}
 +p {color: #00ff00}
 +p {color: rgb(0%, 100%, 0%)}
 +</code>
 +
 +В этом примере все способы задания цвета равнозначны и приведут к одному и тому же результату - цвет параграфов станет ярко-зеленым.
 +
 +====== Именованные цвета ======
 +
 +Это базовые цвета, используемые в CSS. В старые добрые времена они использовались дизайнерами для создания страниц поисковых систем, а также в дизайне сайтов с огромной аудиторией, то есть там, где нужна максимальная совместимость. Все они прекрасно отображаются даже в 256-цветном режиме работы видеокарты. Несомненно, для оригинального цветового дизайна обычных сайтов их маловато.
 +
 +<html>
 +<table cellspacing=1 cellpadding=5 border=0 width="100%">
 +<tr>
 +<td style="background-color:black">&nbsp;</td><TD>Black</td>
 +<td style="background-color:Navy">&nbsp;</td><TD>Navy</td>
 +</tr>
 +<tr>
 +<td style="background-color:Gray">&nbsp;</td><TD>Gray</td>
 +<td style="background-color:Blue">&nbsp;</td><TD>Blue</td>
 +</tr>
 +<tr>
 +<td style="background-color:Silver">&nbsp;</td><TD>Silver</td>
 +
 +<td style="background-color:Aqua">&nbsp;</td><TD>Aqua</td>
 +</tr>
 +<tr>
 +<td style="background-color:White">&nbsp;</td><TD>White</td>
 +<td style="background-color:Green">&nbsp;</td><TD>Green</td>
 +</tr>
 +<tr>
 +<td style="background-color:Red">&nbsp;</td><TD>Red</td>
 +<td style="background-color:Lime">&nbsp;</td><TD>Lime</td>
 +</tr>
 +<tr>
 +<td style="background-color:Fuchsia">&nbsp;</td><TD>Fuchsia</td>
 +
 +<td style="background-color:Teal">&nbsp;</td><TD>Teal</td>
 +</tr>
 +<tr>
 +<td style="background-color:Maroon">&nbsp;</td><TD>Maroon</td>
 +<td style="background-color:Yellow">&nbsp;</td><TD>Yellow</td>
 +</tr>
 +<tr>
 +<td style="background-color:Purple">&nbsp;</td><TD>Purple</td>
 +<td style="background-color:Olive">&nbsp;</td><TD>Olive</td>
 +</tr>
 +</table>
 +</html>
 +
 +
 +Для старых 256-цветных видеокарт рекомендуется использовать так называемые безопасные цвета. Сейчас это не очень актуально, поэтому вы можете определить в RGB-формате любой из более чем 16 млн. оттенков.
 +
 +====== Безопасные (browser-safe) цвета в CSS ======
 +
 +
 +Для получения любого оттенка применяются комбинации RGB-значений цвета, записанные в шестнадцатиричном формате(подробнее - см. Как задать цвет в CSS).
 +
 +Приведенные ниже 216 цветов считаются "безопасными" (browser-safe). Это значит, что даже на старом мониторе в 256-цветном режиме они должны выглядеть ровно и красиво.
 +
 +Для удобства я расположил "безопасные" цвета в три таблицы по 216 цветов, отсортированные по разным цветовым компонентам.
 +
 +<html>
 +<table border=0 cellpadding=0 cellspacing=1 width="100%">
 +<tr><th colspan=6>КРАСНЫЙ И СИНИЙ &#150; ДОБАВЛЯЕМ ЗЕЛЕНЫЙ</th></tr>
 +<tr align=center>
 +<td style="background-color: #000000; color: #999999;">000000</td>
 +<td style="background-color: #000033; color: #999999;">000033</td>
 +
 +<td style="background-color: #000066; color: #999999;">000066</td>
 +<td style="background-color: #000099; color: #999999;">000099</td>
 +<td style="background-color: #0000CC; color: #999999;">0000CC</td>
 +<td style="background-color: #0000FF; color: #999999;">0000FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #330000; color: #999999;">330000</td>
 +<td style="background-color: #330033; color: #999999;">330033</td>
 +<td style="background-color: #330066; color: #999999;">330066</td>
 +<td style="background-color: #330099; color: #999999;">330099</td>
 +
 +<td style="background-color: #3300CC; color: #999999;">3300CC</td>
 +<td style="background-color: #3300FF; color: #999999;">3300FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #660000; color: #999999;">660000</td>
 +<td style="background-color: #660033; color: #999999;">660033</td>
 +<td style="background-color: #660066; color: #999999;">660066</td>
 +<td style="background-color: #660099; color: #999999;">660099</td>
 +<td style="background-color: #6600CC; color: #999999;">6600CC</td>
 +<td style="background-color: #6600FF; color: #999999;">6600FF</td>
 +
 +</tr>
 +<tr align=center>
 +<td style="background-color: #990000; color: #000000;">990000</td>
 +<td style="background-color: #990033; color: #000000;">990033</td>
 +<td style="background-color: #990066; color: #000000;">990066</td>
 +<td style="background-color: #990099; color: #000000;">990099</td>
 +<td style="background-color: #9900CC; color: #000000;">9900CC</td>
 +<td style="background-color: #9900FF; color: #000000;">9900FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0000; color: #000000;">CC0000</td>
 +
 +<td style="background-color: #CC0033; color: #000000;">CC0033</td>
 +<td style="background-color: #CC0066; color: #000000;">CC0066</td>
 +<td style="background-color: #CC0099; color: #000000;">CC0099</td>
 +<td style="background-color: #CC00CC; color: #000000;">CC00CC</td>
 +<td style="background-color: #CC00FF; color: #000000;">CC00FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF0000; color: #000000;">FF0000</td>
 +<td style="background-color: #FF0033; color: #000000;">FF0033</td>
 +<td style="background-color: #FF0066; color: #000000;">FF0066</td>
 +
 +<td style="background-color: #FF0099; color: #000000;">FF0099</td>
 +<td style="background-color: #FF00CC; color: #000000;">FF00CC</td>
 +<td style="background-color: #FF00FF; color: #000000;">FF00FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #003300; color: #999999;">003300</td>
 +<td style="background-color: #003333; color: #999999;">003333</td>
 +<td style="background-color: #003366; color: #999999;">003366</td>
 +<td style="background-color: #003399; color: #999999;">003399</td>
 +<td style="background-color: #0033CC; color: #999999;">0033CC</td>
 +
 +<td style="background-color: #0033FF; color: #999999;">0033FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #333300; color: #999999;">333300</td>
 +<td style="background-color: #333333; color: #999999;">333333</td>
 +<td style="background-color: #333366; color: #999999;">333366</td>
 +<td style="background-color: #333399; color: #999999;">333399</td>
 +<td style="background-color: #3333CC; color: #999999;">3333CC</td>
 +<td style="background-color: #3333FF; color: #999999;">3333FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #663300; color: #999999;">663300</td>
 +<td style="background-color: #663333; color: #999999;">663333</td>
 +<td style="background-color: #663366; color: #999999;">663366</td>
 +<td style="background-color: #663399; color: #999999;">663399</td>
 +<td style="background-color: #6633CC; color: #999999;">6633CC</td>
 +<td style="background-color: #6633FF; color: #999999;">6633FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #993300; color: #000000;">993300</td>
 +
 +<td style="background-color: #993333; color: #000000;">993333</td>
 +<td style="background-color: #993366; color: #000000;">993366</td>
 +<td style="background-color: #993399; color: #000000;">993399</td>
 +<td style="background-color: #9933CC; color: #000000;">9933CC</td>
 +<td style="background-color: #9933FF; color: #000000;">9933FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC3300; color: #000000;">CC3300</td>
 +<td style="background-color: #CC3333; color: #000000;">CC3333</td>
 +<td style="background-color: #CC3366; color: #000000;">CC3366</td>
 +
 +<td style="background-color: #CC3399; color: #000000;">CC3399</td>
 +<td style="background-color: #CC33CC; color: #000000;">CC33CC</td>
 +<td style="background-color: #CC33FF; color: #000000;">CC33FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF3300; color: #000000;">FF3300</td>
 +<td style="background-color: #FF3333; color: #000000;">FF3333</td>
 +<td style="background-color: #FF3366; color: #000000;">FF3366</td>
 +<td style="background-color: #FF3399; color: #000000;">FF3399</td>
 +<td style="background-color: #FF33CC; color: #000000;">FF33CC</td>
 +
 +<td style="background-color: #FF33FF; color: #000000;">FF33FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #006600; color: #000000;">006600</td>
 +<td style="background-color: #006633; color: #000000;">006633</td>
 +<td style="background-color: #006666; color: #000000;">006666</td>
 +<td style="background-color: #006699; color: #000000;">006699</td>
 +<td style="background-color: #0066CC; color: #000000;">0066CC</td>
 +<td style="background-color: #0066FF; color: #000000;">0066FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #336600; color: #000000;">336600</td>
 +<td style="background-color: #336633; color: #000000;">336633</td>
 +<td style="background-color: #336666; color: #000000;">336666</td>
 +<td style="background-color: #336699; color: #000000;">336699</td>
 +<td style="background-color: #3366CC; color: #000000;">3366CC</td>
 +<td style="background-color: #3366FF; color: #000000;">3366FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #666600; color: #000000;">666600</td>
 +
 +<td style="background-color: #666633; color: #000000;">666633</td>
 +<td style="background-color: #666666; color: #000000;">666666</td>
 +<td style="background-color: #666699; color: #000000;">666699</td>
 +<td style="background-color: #6666CC; color: #000000;">6666CC</td>
 +<td style="background-color: #6666FF; color: #000000;">6666FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #996600; color: #000000;">996600</td>
 +<td style="background-color: #996633; color: #000000;">996633</td>
 +<td style="background-color: #996666; color: #000000;">996666</td>
 +
 +<td style="background-color: #996699; color: #000000;">996699</td>
 +<td style="background-color: #9966CC; color: #000000;">9966CC</td>
 +<td style="background-color: #9966FF; color: #000000;">9966FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC6600; color: #000000;">CC6600</td>
 +<td style="background-color: #CC6633; color: #000000;">CC6633</td>
 +<td style="background-color: #CC6666; color: #000000;">CC6666</td>
 +<td style="background-color: #CC6699; color: #000000;">CC6699</td>
 +<td style="background-color: #CC66CC; color: #000000;">CC66CC</td>
 +
 +<td style="background-color: #CC66FF; color: #000000;">CC66FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF6600; color: #000000;">FF6600</td>
 +<td style="background-color: #FF6633; color: #000000;">FF6633</td>
 +<td style="background-color: #FF6666; color: #000000;">FF6666</td>
 +<td style="background-color: #FF6699; color: #000000;">FF6699</td>
 +<td style="background-color: #FF66CC; color: #000000;">FF66CC</td>
 +<td style="background-color: #FF66FF; color: #000000;">FF66FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #009900; color: #000000;">009900</td>
 +<td style="background-color: #009933; color: #000000;">009933</td>
 +<td style="background-color: #009966; color: #000000;">009966</td>
 +<td style="background-color: #009999; color: #000000;">009999</td>
 +<td style="background-color: #0099CC; color: #000000;">0099CC</td>
 +<td style="background-color: #0099FF; color: #000000;">0099FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #339900; color: #000000;">339900</td>
 +
 +<td style="background-color: #339933; color: #000000;">339933</td>
 +<td style="background-color: #339966; color: #000000;">339966</td>
 +<td style="background-color: #339999; color: #000000;">339999</td>
 +<td style="background-color: #3399CC; color: #000000;">3399CC</td>
 +<td style="background-color: #3399FF; color: #000000;">3399FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #669900; color: #000000;">669900</td>
 +<td style="background-color: #669933; color: #000000;">669933</td>
 +<td style="background-color: #669966; color: #000000;">669966</td>
 +
 +<td style="background-color: #669999; color: #000000;">669999</td>
 +<td style="background-color: #6699CC; color: #000000;">6699CC</td>
 +<td style="background-color: #6699FF; color: #000000;">6699FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #999900; color: #000000;">999900</td>
 +<td style="background-color: #999933; color: #000000;">999933</td>
 +<td style="background-color: #999966; color: #000000;">999966</td>
 +<td style="background-color: #999999; color: #000000;">999999</td>
 +<td style="background-color: #9999CC; color: #000000;">9999CC</td>
 +
 +<td style="background-color: #9999FF; color: #000000;">9999FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC9900; color: #000000;">CC9900</td>
 +<td style="background-color: #CC9933; color: #000000;">CC9933</td>
 +<td style="background-color: #CC9966; color: #000000;">CC9966</td>
 +<td style="background-color: #CC9999; color: #000000;">CC9999</td>
 +<td style="background-color: #CC99CC; color: #000000;">CC99CC</td>
 +<td style="background-color: #CC99FF; color: #000000;">CC99FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #FF9900; color: #000000;">FF9900</td>
 +<td style="background-color: #FF9933; color: #000000;">FF9933</td>
 +<td style="background-color: #FF9966; color: #000000;">FF9966</td>
 +<td style="background-color: #FF9999; color: #000000;">FF9999</td>
 +<td style="background-color: #FF99CC; color: #000000;">FF99CC</td>
 +<td style="background-color: #FF99FF; color: #000000;">FF99FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #00CC00; color: #000000;">00CC00</td>
 +
 +<td style="background-color: #00CC33; color: #000000;">00CC33</td>
 +<td style="background-color: #00CC66; color: #000000;">00CC66</td>
 +<td style="background-color: #00CC99; color: #000000;">00CC99</td>
 +<td style="background-color: #00CCCC; color: #000000;">00CCCC</td>
 +<td style="background-color: #00CCFF; color: #000000;">00CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #33CC00; color: #000000;">33CC00</td>
 +<td style="background-color: #33CC33; color: #000000;">33CC33</td>
 +<td style="background-color: #33CC66; color: #000000;">33CC66</td>
 +
 +<td style="background-color: #33CC99; color: #000000;">33CC99</td>
 +<td style="background-color: #33CCCC; color: #000000;">33CCCC</td>
 +<td style="background-color: #33CCFF; color: #000000;">33CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #66CC00; color: #000000;">66CC00</td>
 +<td style="background-color: #66CC33; color: #000000;">66CC33</td>
 +<td style="background-color: #66CC66; color: #000000;">66CC66</td>
 +<td style="background-color: #66CC99; color: #000000;">66CC99</td>
 +<td style="background-color: #66CCCC; color: #000000;">66CCCC</td>
 +
 +<td style="background-color: #66CCFF; color: #000000;">66CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #99CC00; color: #000000;">99CC00</td>
 +<td style="background-color: #99CC33; color: #000000;">99CC33</td>
 +<td style="background-color: #99CC66; color: #000000;">99CC66</td>
 +<td style="background-color: #99CC99; color: #000000;">99CC99</td>
 +<td style="background-color: #99CCCC; color: #000000;">99CCCC</td>
 +<td style="background-color: #99CCFF; color: #000000;">99CCFF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #CCCC00; color: #000000;">CCCC00</td>
 +<td style="background-color: #CCCC33; color: #000000;">CCCC33</td>
 +<td style="background-color: #CCCC66; color: #000000;">CCCC66</td>
 +<td style="background-color: #CCCC99; color: #000000;">CCCC99</td>
 +<td style="background-color: #CCCCCC; color: #000000;">CCCCCC</td>
 +<td style="background-color: #CCCCFF; color: #000000;">CCCCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FFCC00; color: #000000;">FFCC00</td>
 +
 +<td style="background-color: #FFCC33; color: #000000;">FFCC33</td>
 +<td style="background-color: #FFCC66; color: #000000;">FFCC66</td>
 +<td style="background-color: #FFCC99; color: #000000;">FFCC99</td>
 +<td style="background-color: #FFCCCC; color: #000000;">FFCCCC</td>
 +<td style="background-color: #FFCCFF; color: #000000;">FFCCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #00FF00; color: #000000;">00FF00</td>
 +<td style="background-color: #00FF33; color: #000000;">00FF33</td>
 +<td style="background-color: #00FF66; color: #000000;">00FF66</td>
 +
 +<td style="background-color: #00FF99; color: #000000;">00FF99</td>
 +<td style="background-color: #00FFCC; color: #000000;">00FFCC</td>
 +<td style="background-color: #00FFFF; color: #000000;">00FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #33FF00; color: #000000;">33FF00</td>
 +<td style="background-color: #33FF33; color: #000000;">33FF33</td>
 +<td style="background-color: #33FF66; color: #000000;">33FF66</td>
 +<td style="background-color: #33FF99; color: #000000;">33FF99</td>
 +<td style="background-color: #33FFCC; color: #000000;">33FFCC</td>
 +
 +<td style="background-color: #33FFFF; color: #000000;">33FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #66FF00; color: #000000;">66FF00</td>
 +<td style="background-color: #66FF33; color: #000000;">66FF33</td>
 +<td style="background-color: #66FF66; color: #000000;">66FF66</td>
 +<td style="background-color: #66FF99; color: #000000;">66FF99</td>
 +<td style="background-color: #66FFCC; color: #000000;">66FFCC</td>
 +<td style="background-color: #66FFFF; color: #000000;">66FFFF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #99FF00; color: #000000;">99FF00</td>
 +<td style="background-color: #99FF33; color: #000000;">99FF33</td>
 +<td style="background-color: #99FF66; color: #000000;">99FF66</td>
 +<td style="background-color: #99FF99; color: #000000;">99FF99</td>
 +<td style="background-color: #99FFCC; color: #000000;">99FFCC</td>
 +<td style="background-color: #99FFFF; color: #000000;">99FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CCFF00; color: #000000;">CCFF00</td>
 +
 +<td style="background-color: #CCFF33; color: #000000;">CCFF33</td>
 +<td style="background-color: #CCFF66; color: #000000;">CCFF66</td>
 +<td style="background-color: #CCFF99; color: #000000;">CCFF99</td>
 +<td style="background-color: #CCFFCC; color: #000000;">CCFFCC</td>
 +<td style="background-color: #CCFFFF; color: #000000;">CCFFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FFFF00; color: #000000;">FFFF00</td>
 +<td style="background-color: #FFFF33; color: #000000;">FFFF33</td>
 +<td style="background-color: #FFFF66; color: #000000;">FFFF66</td>
 +
 +<td style="background-color: #FFFF99; color: #000000;">FFFF99</td>
 +<td style="background-color: #FFFFCC; color: #000000;">FFFFCC</td>
 +<td style="background-color: #FFFFFF; color: #000000;">FFFFFF</td>
 +</tr>
 +<tr><th colspan=6>КРАСНЫЙ И ЗЕЛЕНЫЙ &#150; ДОБАВЛЯЕМ СИНИЙ</th></tr>
 +<tr align=center>
 +<td style="background-color: #000000; color: #999999;">000000</td>
 +<td style="background-color: #003300; color: #999999;">003300</td>
 +<td style="background-color: #006600; color: #000000;">006600</td>
 +
 +<td style="background-color: #009900; color: #000000;">009900</td>
 +<td style="background-color: #00CC00; color: #000000;">00CC00</td>
 +<td style="background-color: #00FF00; color: #000000;">00FF00</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #330000; color: #999999;">330000</td>
 +<td style="background-color: #333300; color: #999999;">333300</td>
 +<td style="background-color: #336600; color: #000000;">336600</td>
 +<td style="background-color: #339900; color: #000000;">339900</td>
 +
 +<td style="background-color: #33CC00; color: #000000;">33CC00</td>
 +<td style="background-color: #33FF00; color: #000000;">33FF00</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #660000; color: #999999;">660000</td>
 +<td style="background-color: #663300; color: #999999;">663300</td>
 +<td style="background-color: #666600; color: #000000;">666600</td>
 +<td style="background-color: #669900; color: #000000;">669900</td>
 +<td style="background-color: #66CC00; color: #000000;">66CC00</td>
 +<td style="background-color: #66FF00; color: #000000;">66FF00</td>
 +
 +</tr>
 +<tr align=center>
 +<td style="background-color: #990000; color: #000000;">990000</td>
 +<td style="background-color: #993300; color: #000000;">993300</td>
 +<td style="background-color: #996600; color: #000000;">996600</td>
 +<td style="background-color: #999900; color: #000000;">999900</td>
 +<td style="background-color: #99CC00; color: #000000;">99CC00</td>
 +<td style="background-color: #99FF00; color: #000000;">99FF00</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0000; color: #000000;">CC0000</td>
 +
 +<td style="background-color: #CC3300; color: #000000;">CC3300</td>
 +<td style="background-color: #CC6600; color: #000000;">CC6600</td>
 +<td style="background-color: #CC9900; color: #000000;">CC9900</td>
 +<td style="background-color: #CCCC00; color: #000000;">CCCC00</td>
 +<td style="background-color: #CCFF00; color: #000000;">CCFF00</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF0000; color: #000000;">FF0000</td>
 +<td style="background-color: #FF3300; color: #000000;">FF3300</td>
 +<td style="background-color: #FF6600; color: #000000;">FF6600</td>
 +
 +<td style="background-color: #FF9900; color: #000000;">FF9900</td>
 +<td style="background-color: #FFCC00; color: #000000;">FFCC00</td>
 +<td style="background-color: #FFFF00; color: #000000;">FFFF00</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #000033; color: #999999;">000033</td>
 +<td style="background-color: #003333; color: #999999;">003333</td>
 +<td style="background-color: #006633; color: #000000;">006633</td>
 +<td style="background-color: #009933; color: #000000;">009933</td>
 +<td style="background-color: #00CC33; color: #000000;">00CC33</td>
 +
 +<td style="background-color: #00FF33; color: #000000;">00FF33</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #330033; color: #999999;">330033</td>
 +<td style="background-color: #333333; color: #999999;">333333</td>
 +<td style="background-color: #336633; color: #000000;">336633</td>
 +<td style="background-color: #339933; color: #000000;">339933</td>
 +<td style="background-color: #33CC33; color: #000000;">33CC33</td>
 +<td style="background-color: #33FF33; color: #000000;">33FF33</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #660033; color: #999999;">660033</td>
 +<td style="background-color: #663333; color: #999999;">663333</td>
 +<td style="background-color: #666633; color: #000000;">666633</td>
 +<td style="background-color: #669933; color: #000000;">669933</td>
 +<td style="background-color: #66CC33; color: #000000;">66CC33</td>
 +<td style="background-color: #66FF33; color: #000000;">66FF33</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #990033; color: #000000;">990033</td>
 +
 +<td style="background-color: #993333; color: #000000;">993333</td>
 +<td style="background-color: #996633; color: #000000;">996633</td>
 +<td style="background-color: #999933; color: #000000;">999933</td>
 +<td style="background-color: #99CC33; color: #000000;">99CC33</td>
 +<td style="background-color: #99FF33; color: #000000;">99FF33</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0033; color: #000000;">CC0033</td>
 +<td style="background-color: #CC3333; color: #000000;">CC3333</td>
 +<td style="background-color: #CC6633; color: #000000;">CC6633</td>
 +
 +<td style="background-color: #CC9933; color: #000000;">CC9933</td>
 +<td style="background-color: #CCCC33; color: #000000;">CCCC33</td>
 +<td style="background-color: #CCFF33; color: #000000;">CCFF33</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF0033; color: #000000;">FF0033</td>
 +<td style="background-color: #FF3333; color: #000000;">FF3333</td>
 +<td style="background-color: #FF6633; color: #000000;">FF6633</td>
 +<td style="background-color: #FF9933; color: #000000;">FF9933</td>
 +<td style="background-color: #FFCC33; color: #000000;">FFCC33</td>
 +
 +<td style="background-color: #FFFF33; color: #000000;">FFFF33</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #000066; color: #999999;">000066</td>
 +<td style="background-color: #003366; color: #999999;">003366</td>
 +<td style="background-color: #006666; color: #000000;">006666</td>
 +<td style="background-color: #009966; color: #000000;">009966</td>
 +<td style="background-color: #00CC66; color: #000000;">00CC66</td>
 +<td style="background-color: #00FF66; color: #000000;">00FF66</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #330066; color: #999999;">330066</td>
 +<td style="background-color: #333366; color: #999999;">333366</td>
 +<td style="background-color: #336666; color: #000000;">336666</td>
 +<td style="background-color: #339966; color: #000000;">339966</td>
 +<td style="background-color: #33CC66; color: #000000;">33CC66</td>
 +<td style="background-color: #33FF66; color: #000000;">33FF66</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #660066; color: #999999;">660066</td>
 +
 +<td style="background-color: #663366; color: #999999;">663366</td>
 +<td style="background-color: #666666; color: #000000;">666666</td>
 +<td style="background-color: #669966; color: #000000;">669966</td>
 +<td style="background-color: #66CC66; color: #000000;">66CC66</td>
 +<td style="background-color: #66FF66; color: #000000;">66FF66</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #990066; color: #000000;">990066</td>
 +<td style="background-color: #993366; color: #000000;">993366</td>
 +<td style="background-color: #996666; color: #000000;">996666</td>
 +
 +<td style="background-color: #999966; color: #000000;">999966</td>
 +<td style="background-color: #99CC66; color: #000000;">99CC66</td>
 +<td style="background-color: #99FF66; color: #000000;">99FF66</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0066; color: #000000;">CC0066</td>
 +<td style="background-color: #CC3366; color: #000000;">CC3366</td>
 +<td style="background-color: #CC6666; color: #000000;">CC6666</td>
 +<td style="background-color: #CC9966; color: #000000;">CC9966</td>
 +<td style="background-color: #CCCC66; color: #000000;">CCCC66</td>
 +
 +<td style="background-color: #CCFF66; color: #000000;">CCFF66</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF0066; color: #000000;">FF0066</td>
 +<td style="background-color: #FF3366; color: #000000;">FF3366</td>
 +<td style="background-color: #FF6666; color: #000000;">FF6666</td>
 +<td style="background-color: #FF9966; color: #000000;">FF9966</td>
 +<td style="background-color: #FFCC66; color: #000000;">FFCC66</td>
 +<td style="background-color: #FFFF66; color: #000000;">FFFF66</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #000099; color: #999999;">000099</td>
 +<td style="background-color: #003399; color: #999999;">003399</td>
 +<td style="background-color: #006699; color: #000000;">006699</td>
 +<td style="background-color: #009999; color: #000000;">009999</td>
 +<td style="background-color: #00CC99; color: #000000;">00CC99</td>
 +<td style="background-color: #00FF99; color: #000000;">00FF99</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #330099; color: #999999;">330099</td>
 +
 +<td style="background-color: #333399; color: #999999;">333399</td>
 +<td style="background-color: #336699; color: #000000;">336699</td>
 +<td style="background-color: #339999; color: #000000;">339999</td>
 +<td style="background-color: #33CC99; color: #000000;">33CC99</td>
 +<td style="background-color: #33FF99; color: #000000;">33FF99</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #660099; color: #999999;">660099</td>
 +<td style="background-color: #663399; color: #999999;">663399</td>
 +<td style="background-color: #666699; color: #000000;">666699</td>
 +
 +<td style="background-color: #669999; color: #000000;">669999</td>
 +<td style="background-color: #66CC99; color: #000000;">66CC99</td>
 +<td style="background-color: #66FF99; color: #000000;">66FF99</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #990099; color: #000000;">990099</td>
 +<td style="background-color: #993399; color: #000000;">993399</td>
 +<td style="background-color: #996699; color: #000000;">996699</td>
 +<td style="background-color: #999999; color: #000000;">999999</td>
 +<td style="background-color: #99CC99; color: #000000;">99CC99</td>
 +
 +<td style="background-color: #99FF99; color: #000000;">99FF99</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0099; color: #000000;">CC0099</td>
 +<td style="background-color: #CC3399; color: #000000;">CC3399</td>
 +<td style="background-color: #CC6699; color: #000000;">CC6699</td>
 +<td style="background-color: #CC9999; color: #000000;">CC9999</td>
 +<td style="background-color: #CCCC99; color: #000000;">CCCC99</td>
 +<td style="background-color: #CCFF99; color: #000000;">CCFF99</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #FF0099; color: #000000;">FF0099</td>
 +<td style="background-color: #FF3399; color: #000000;">FF3399</td>
 +<td style="background-color: #FF6699; color: #000000;">FF6699</td>
 +<td style="background-color: #FF9999; color: #000000;">FF9999</td>
 +<td style="background-color: #FFCC99; color: #000000;">FFCC99</td>
 +<td style="background-color: #FFFF99; color: #000000;">FFFF99</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #0000CC; color: #999999;">0000CC</td>
 +
 +<td style="background-color: #0033CC; color: #999999;">0033CC</td>
 +<td style="background-color: #0066CC; color: #000000;">0066CC</td>
 +<td style="background-color: #0099CC; color: #000000;">0099CC</td>
 +<td style="background-color: #00CCCC; color: #000000;">00CCCC</td>
 +<td style="background-color: #00FFCC; color: #000000;">00FFCC</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #3300CC; color: #999999;">3300CC</td>
 +<td style="background-color: #3333CC; color: #999999;">3333CC</td>
 +<td style="background-color: #3366CC; color: #000000;">3366CC</td>
 +
 +<td style="background-color: #3399CC; color: #000000;">3399CC</td>
 +<td style="background-color: #33CCCC; color: #000000;">33CCCC</td>
 +<td style="background-color: #33FFCC; color: #000000;">33FFCC</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #6600CC; color: #999999;">6600CC</td>
 +<td style="background-color: #6633CC; color: #999999;">6633CC</td>
 +<td style="background-color: #6666CC; color: #000000;">6666CC</td>
 +<td style="background-color: #6699CC; color: #000000;">6699CC</td>
 +<td style="background-color: #66CCCC; color: #000000;">66CCCC</td>
 +
 +<td style="background-color: #66FFCC; color: #000000;">66FFCC</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #9900CC; color: #000000;">9900CC</td>
 +<td style="background-color: #9933CC; color: #000000;">9933CC</td>
 +<td style="background-color: #9966CC; color: #000000;">9966CC</td>
 +<td style="background-color: #9999CC; color: #000000;">9999CC</td>
 +<td style="background-color: #99CCCC; color: #000000;">99CCCC</td>
 +<td style="background-color: #99FFCC; color: #000000;">99FFCC</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #CC00CC; color: #000000;">CC00CC</td>
 +<td style="background-color: #CC33CC; color: #000000;">CC33CC</td>
 +<td style="background-color: #CC66CC; color: #000000;">CC66CC</td>
 +<td style="background-color: #CC99CC; color: #000000;">CC99CC</td>
 +<td style="background-color: #CCCCCC; color: #000000;">CCCCCC</td>
 +<td style="background-color: #CCFFCC; color: #000000;">CCFFCC</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF00CC; color: #000000;">FF00CC</td>
 +
 +<td style="background-color: #FF33CC; color: #000000;">FF33CC</td>
 +<td style="background-color: #FF66CC; color: #000000;">FF66CC</td>
 +<td style="background-color: #FF99CC; color: #000000;">FF99CC</td>
 +<td style="background-color: #FFCCCC; color: #000000;">FFCCCC</td>
 +<td style="background-color: #FFFFCC; color: #000000;">FFFFCC</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #0000FF; color: #999999;">0000FF</td>
 +<td style="background-color: #0033FF; color: #999999;">0033FF</td>
 +<td style="background-color: #0066FF; color: #000000;">0066FF</td>
 +
 +<td style="background-color: #0099FF; color: #000000;">0099FF</td>
 +<td style="background-color: #00CCFF; color: #000000;">00CCFF</td>
 +<td style="background-color: #00FFFF; color: #000000;">00FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #3300FF; color: #999999;">3300FF</td>
 +<td style="background-color: #3333FF; color: #999999;">3333FF</td>
 +<td style="background-color: #3366FF; color: #000000;">3366FF</td>
 +<td style="background-color: #3399FF; color: #000000;">3399FF</td>
 +<td style="background-color: #33CCFF; color: #000000;">33CCFF</td>
 +
 +<td style="background-color: #33FFFF; color: #000000;">33FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #6600FF; color: #999999;">6600FF</td>
 +<td style="background-color: #6633FF; color: #999999;">6633FF</td>
 +<td style="background-color: #6666FF; color: #000000;">6666FF</td>
 +<td style="background-color: #6699FF; color: #000000;">6699FF</td>
 +<td style="background-color: #66CCFF; color: #000000;">66CCFF</td>
 +<td style="background-color: #66FFFF; color: #000000;">66FFFF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #9900FF; color: #000000;">9900FF</td>
 +<td style="background-color: #9933FF; color: #000000;">9933FF</td>
 +<td style="background-color: #9966FF; color: #000000;">9966FF</td>
 +<td style="background-color: #9999FF; color: #000000;">9999FF</td>
 +<td style="background-color: #99CCFF; color: #000000;">99CCFF</td>
 +<td style="background-color: #99FFFF; color: #000000;">99FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC00FF; color: #000000;">CC00FF</td>
 +
 +<td style="background-color: #CC33FF; color: #000000;">CC33FF</td>
 +<td style="background-color: #CC66FF; color: #000000;">CC66FF</td>
 +<td style="background-color: #CC99FF; color: #000000;">CC99FF</td>
 +<td style="background-color: #CCCCFF; color: #000000;">CCCCFF</td>
 +<td style="background-color: #CCFFFF; color: #000000;">CCFFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF00FF; color: #000000;">FF00FF</td>
 +<td style="background-color: #FF33FF; color: #000000;">FF33FF</td>
 +<td style="background-color: #FF66FF; color: #000000;">FF66FF</td>
 +
 +<td style="background-color: #FF99FF; color: #000000;">FF99FF</td>
 +<td style="background-color: #FFCCFF; color: #000000;">FFCCFF</td>
 +<td style="background-color: #FFFFFF; color: #000000;">FFFFFF</td>
 +</tr>
 +<tr><th colspan=6>ЗЕЛЕНЫЙ И СИНИЙ &#150; ДОБАВЛЯЕМ КРАСНЫЙ</th></tr>
 +
 +
 +<tr align=center>
 +<td style="background-color: #000000; color: #999999;">000000</td>
 +<td style="background-color: #000033; color: #999999;">000033</td>
 +
 +<td style="background-color: #000066; color: #999999;">000066</td>
 +<td style="background-color: #000099; color: #999999;">000099</td>
 +<td style="background-color: #0000CC; color: #999999;">0000CC</td>
 +<td style="background-color: #0000FF; color: #999999;">0000FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #003300; color: #999999;">003300</td>
 +<td style="background-color: #003333; color: #999999;">003333</td>
 +<td style="background-color: #003366; color: #999999;">003366</td>
 +<td style="background-color: #003399; color: #999999;">003399</td>
 +
 +<td style="background-color: #0033CC; color: #999999;">0033CC</td>
 +<td style="background-color: #0033FF; color: #999999;">0033FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #006600; color: #000000;">006600</td>
 +<td style="background-color: #006633; color: #000000;">006633</td>
 +<td style="background-color: #006666; color: #000000;">006666</td>
 +<td style="background-color: #006699; color: #000000;">006699</td>
 +<td style="background-color: #0066CC; color: #000000;">0066CC</td>
 +<td style="background-color: #0066FF; color: #000000;">0066FF</td>
 +
 +</tr>
 +<tr align=center>
 +<td style="background-color: #009900; color: #000000;">009900</td>
 +<td style="background-color: #009933; color: #000000;">009933</td>
 +<td style="background-color: #009966; color: #000000;">009966</td>
 +<td style="background-color: #009999; color: #000000;">009999</td>
 +<td style="background-color: #0099CC; color: #000000;">0099CC</td>
 +<td style="background-color: #0099FF; color: #000000;">0099FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #00CC00; color: #000000;">00CC00</td>
 +
 +<td style="background-color: #00CC33; color: #000000;">00CC33</td>
 +<td style="background-color: #00CC66; color: #000000;">00CC66</td>
 +<td style="background-color: #00CC99; color: #000000;">00CC99</td>
 +<td style="background-color: #00CCCC; color: #000000;">00CCCC</td>
 +<td style="background-color: #00CCFF; color: #000000;">00CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #00FF00; color: #000000;">00FF00</td>
 +<td style="background-color: #00FF33; color: #000000;">00FF33</td>
 +<td style="background-color: #00FF66; color: #000000;">00FF66</td>
 +
 +<td style="background-color: #00FF99; color: #000000;">00FF99</td>
 +<td style="background-color: #00FFCC; color: #000000;">00FFCC</td>
 +<td style="background-color: #00FFFF; color: #000000;">00FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #330000; color: #999999;">330000</td>
 +<td style="background-color: #330033; color: #999999;">330033</td>
 +<td style="background-color: #330066; color: #999999;">330066</td>
 +<td style="background-color: #330099; color: #999999;">330099</td>
 +<td style="background-color: #3300CC; color: #999999;">3300CC</td>
 +
 +<td style="background-color: #3300FF; color: #999999;">3300FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #333300; color: #999999;">333300</td>
 +<td style="background-color: #333333; color: #999999;">333333</td>
 +<td style="background-color: #333366; color: #999999;">333366</td>
 +<td style="background-color: #333399; color: #999999;">333399</td>
 +<td style="background-color: #3333CC; color: #999999;">3333CC</td>
 +<td style="background-color: #3333FF; color: #999999;">3333FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #336600; color: #000000;">336600</td>
 +<td style="background-color: #336633; color: #000000;">336633</td>
 +<td style="background-color: #336666; color: #000000;">336666</td>
 +<td style="background-color: #336699; color: #000000;">336699</td>
 +<td style="background-color: #3366CC; color: #000000;">3366CC</td>
 +<td style="background-color: #3366FF; color: #000000;">3366FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #339900; color: #000000;">339900</td>
 +
 +<td style="background-color: #339933; color: #000000;">339933</td>
 +<td style="background-color: #339966; color: #000000;">339966</td>
 +<td style="background-color: #339999; color: #000000;">339999</td>
 +<td style="background-color: #3399CC; color: #000000;">3399CC</td>
 +<td style="background-color: #3399FF; color: #000000;">3399FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #33CC00; color: #000000;">33CC00</td>
 +<td style="background-color: #33CC33; color: #000000;">33CC33</td>
 +<td style="background-color: #33CC66; color: #000000;">33CC66</td>
 +
 +<td style="background-color: #33CC99; color: #000000;">33CC99</td>
 +<td style="background-color: #33CCCC; color: #000000;">33CCCC</td>
 +<td style="background-color: #33CCFF; color: #000000;">33CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #33FF00; color: #000000;">33FF00</td>
 +<td style="background-color: #33FF33; color: #000000;">33FF33</td>
 +<td style="background-color: #33FF66; color: #000000;">33FF66</td>
 +<td style="background-color: #33FF99; color: #000000;">33FF99</td>
 +<td style="background-color: #33FFCC; color: #000000;">33FFCC</td>
 +
 +<td style="background-color: #33FFFF; color: #000000;">33FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #660000; color: #999999;">660000</td>
 +<td style="background-color: #660033; color: #999999;">660033</td>
 +<td style="background-color: #660066; color: #999999;">660066</td>
 +<td style="background-color: #660099; color: #999999;">660099</td>
 +<td style="background-color: #6600CC; color: #999999;">6600CC</td>
 +<td style="background-color: #6600FF; color: #999999;">6600FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #663300; color: #999999;">663300</td>
 +<td style="background-color: #663333; color: #999999;">663333</td>
 +<td style="background-color: #663366; color: #999999;">663366</td>
 +<td style="background-color: #663399; color: #999999;">663399</td>
 +<td style="background-color: #6633CC; color: #999999;">6633CC</td>
 +<td style="background-color: #6633FF; color: #999999;">6633FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #666600; color: #000000;">666600</td>
 +
 +<td style="background-color: #666633; color: #000000;">666633</td>
 +<td style="background-color: #666666; color: #000000;">666666</td>
 +<td style="background-color: #666699; color: #000000;">666699</td>
 +<td style="background-color: #6666CC; color: #000000;">6666CC</td>
 +<td style="background-color: #6666FF; color: #000000;">6666FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #669900; color: #000000;">669900</td>
 +<td style="background-color: #669933; color: #000000;">669933</td>
 +<td style="background-color: #669966; color: #000000;">669966</td>
 +
 +<td style="background-color: #669999; color: #000000;">669999</td>
 +<td style="background-color: #6699CC; color: #000000;">6699CC</td>
 +<td style="background-color: #6699FF; color: #000000;">6699FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #66CC00; color: #000000;">66CC00</td>
 +<td style="background-color: #66CC33; color: #000000;">66CC33</td>
 +<td style="background-color: #66CC66; color: #000000;">66CC66</td>
 +<td style="background-color: #66CC99; color: #000000;">66CC99</td>
 +<td style="background-color: #66CCCC; color: #000000;">66CCCC</td>
 +
 +<td style="background-color: #66CCFF; color: #000000;">66CCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #66FF00; color: #000000;">66FF00</td>
 +<td style="background-color: #66FF33; color: #000000;">66FF33</td>
 +<td style="background-color: #66FF66; color: #000000;">66FF66</td>
 +<td style="background-color: #66FF99; color: #000000;">66FF99</td>
 +<td style="background-color: #66FFCC; color: #000000;">66FFCC</td>
 +<td style="background-color: #66FFFF; color: #000000;">66FFFF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #990000; color: #000000;">990000</td>
 +<td style="background-color: #990033; color: #000000;">990033</td>
 +<td style="background-color: #990066; color: #000000;">990066</td>
 +<td style="background-color: #990099; color: #000000;">990099</td>
 +<td style="background-color: #9900CC; color: #000000;">9900CC</td>
 +<td style="background-color: #9900FF; color: #000000;">9900FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #993300; color: #000000;">993300</td>
 +
 +<td style="background-color: #993333; color: #000000;">993333</td>
 +<td style="background-color: #993366; color: #000000;">993366</td>
 +<td style="background-color: #993399; color: #000000;">993399</td>
 +<td style="background-color: #9933CC; color: #000000;">9933CC</td>
 +<td style="background-color: #9933FF; color: #000000;">9933FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #996600; color: #000000;">996600</td>
 +<td style="background-color: #996633; color: #000000;">996633</td>
 +<td style="background-color: #996666; color: #000000;">996666</td>
 +
 +<td style="background-color: #996699; color: #000000;">996699</td>
 +<td style="background-color: #9966CC; color: #000000;">9966CC</td>
 +<td style="background-color: #9966FF; color: #000000;">9966FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #999900; color: #000000;">999900</td>
 +<td style="background-color: #999933; color: #000000;">999933</td>
 +<td style="background-color: #999966; color: #000000;">999966</td>
 +<td style="background-color: #999999; color: #000000;">999999</td>
 +<td style="background-color: #9999CC; color: #000000;">9999CC</td>
 +
 +<td style="background-color: #9999FF; color: #000000;">9999FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #99CC00; color: #000000;">99CC00</td>
 +<td style="background-color: #99CC33; color: #000000;">99CC33</td>
 +<td style="background-color: #99CC66; color: #000000;">99CC66</td>
 +<td style="background-color: #99CC99; color: #000000;">99CC99</td>
 +<td style="background-color: #99CCCC; color: #000000;">99CCCC</td>
 +<td style="background-color: #99CCFF; color: #000000;">99CCFF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #99FF00; color: #000000;">99FF00</td>
 +<td style="background-color: #99FF33; color: #000000;">99FF33</td>
 +<td style="background-color: #99FF66; color: #000000;">99FF66</td>
 +<td style="background-color: #99FF99; color: #000000;">99FF99</td>
 +<td style="background-color: #99FFCC; color: #000000;">99FFCC</td>
 +<td style="background-color: #99FFFF; color: #000000;">99FFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC0000; color: #000000;">CC0000</td>
 +
 +<td style="background-color: #CC0033; color: #000000;">CC0033</td>
 +<td style="background-color: #CC0066; color: #000000;">CC0066</td>
 +<td style="background-color: #CC0099; color: #000000;">CC0099</td>
 +<td style="background-color: #CC00CC; color: #000000;">CC00CC</td>
 +<td style="background-color: #CC00FF; color: #000000;">CC00FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC3300; color: #000000;">CC3300</td>
 +<td style="background-color: #CC3333; color: #000000;">CC3333</td>
 +<td style="background-color: #CC3366; color: #000000;">CC3366</td>
 +
 +<td style="background-color: #CC3399; color: #000000;">CC3399</td>
 +<td style="background-color: #CC33CC; color: #000000;">CC33CC</td>
 +<td style="background-color: #CC33FF; color: #000000;">CC33FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC6600; color: #000000;">CC6600</td>
 +<td style="background-color: #CC6633; color: #000000;">CC6633</td>
 +<td style="background-color: #CC6666; color: #000000;">CC6666</td>
 +<td style="background-color: #CC6699; color: #000000;">CC6699</td>
 +<td style="background-color: #CC66CC; color: #000000;">CC66CC</td>
 +
 +<td style="background-color: #CC66FF; color: #000000;">CC66FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CC9900; color: #000000;">CC9900</td>
 +<td style="background-color: #CC9933; color: #000000;">CC9933</td>
 +<td style="background-color: #CC9966; color: #000000;">CC9966</td>
 +<td style="background-color: #CC9999; color: #000000;">CC9999</td>
 +<td style="background-color: #CC99CC; color: #000000;">CC99CC</td>
 +<td style="background-color: #CC99FF; color: #000000;">CC99FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #CCCC00; color: #000000;">CCCC00</td>
 +<td style="background-color: #CCCC33; color: #000000;">CCCC33</td>
 +<td style="background-color: #CCCC66; color: #000000;">CCCC66</td>
 +<td style="background-color: #CCCC99; color: #000000;">CCCC99</td>
 +<td style="background-color: #CCCCCC; color: #000000;">CCCCCC</td>
 +<td style="background-color: #CCCCFF; color: #000000;">CCCCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #CCFF00; color: #000000;">CCFF00</td>
 +
 +<td style="background-color: #CCFF33; color: #000000;">CCFF33</td>
 +<td style="background-color: #CCFF66; color: #000000;">CCFF66</td>
 +<td style="background-color: #CCFF99; color: #000000;">CCFF99</td>
 +<td style="background-color: #CCFFCC; color: #000000;">CCFFCC</td>
 +<td style="background-color: #CCFFFF; color: #000000;">CCFFFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF0000; color: #000000;">FF0000</td>
 +<td style="background-color: #FF0033; color: #000000;">FF0033</td>
 +<td style="background-color: #FF0066; color: #000000;">FF0066</td>
 +
 +<td style="background-color: #FF0099; color: #000000;">FF0099</td>
 +<td style="background-color: #FF00CC; color: #000000;">FF00CC</td>
 +<td style="background-color: #FF00FF; color: #000000;">FF00FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF3300; color: #000000;">FF3300</td>
 +<td style="background-color: #FF3333; color: #000000;">FF3333</td>
 +<td style="background-color: #FF3366; color: #000000;">FF3366</td>
 +<td style="background-color: #FF3399; color: #000000;">FF3399</td>
 +<td style="background-color: #FF33CC; color: #000000;">FF33CC</td>
 +
 +<td style="background-color: #FF33FF; color: #000000;">FF33FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FF6600; color: #000000;">FF6600</td>
 +<td style="background-color: #FF6633; color: #000000;">FF6633</td>
 +<td style="background-color: #FF6666; color: #000000;">FF6666</td>
 +<td style="background-color: #FF6699; color: #000000;">FF6699</td>
 +<td style="background-color: #FF66CC; color: #000000;">FF66CC</td>
 +<td style="background-color: #FF66FF; color: #000000;">FF66FF</td>
 +</tr>
 +
 +<tr align=center>
 +<td style="background-color: #FF9900; color: #000000;">FF9900</td>
 +<td style="background-color: #FF9933; color: #000000;">FF9933</td>
 +<td style="background-color: #FF9966; color: #000000;">FF9966</td>
 +<td style="background-color: #FF9999; color: #000000;">FF9999</td>
 +<td style="background-color: #FF99CC; color: #000000;">FF99CC</td>
 +<td style="background-color: #FF99FF; color: #000000;">FF99FF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FFCC00; color: #000000;">FFCC00</td>
 +
 +<td style="background-color: #FFCC33; color: #000000;">FFCC33</td>
 +<td style="background-color: #FFCC66; color: #000000;">FFCC66</td>
 +<td style="background-color: #FFCC99; color: #000000;">FFCC99</td>
 +<td style="background-color: #FFCCCC; color: #000000;">FFCCCC</td>
 +<td style="background-color: #FFCCFF; color: #000000;">FFCCFF</td>
 +</tr>
 +<tr align=center>
 +<td style="background-color: #FFFF00; color: #000000;">FFFF00</td>
 +<td style="background-color: #FFFF33; color: #000000;">FFFF33</td>
 +<td style="background-color: #FFFF66; color: #000000;">FFFF66</td>
 +
 +<td style="background-color: #FFFF99; color: #000000;">FFFF99</td>
 +<td style="background-color: #FFFFCC; color: #000000;">FFFFCC</td>
 +<td style="background-color: #FFFFFF; color: #000000;">FFFFFF</td>
 +</tr>
 +</table>
 +</html>
 +
 +Подготовлено по материалам [[http://css.manual.ru|http://css.manual.ru]]