Золотистый html. Цвета в "МТА": что нужно знать? Коды цветов
К сожалению, вкусовые ощущения на сайте отобразить пока невозможно. Но это можно сполна компенсировать с помощью цветовой гаммы. Ведь цвета html позволяют отобразить любой из миллионов оттенков. Так что «цветных карандашей » в его наборе намного больше, чем семь.
Цветовая гамма в html
В html цвет может быть задан в нескольких форматах:
1. В виде шестнадцатеричного значения – используются код, заданный в шестнадцатеричной системе исчисления. Такие коды цветов в html состоят из трех пар шестнадцатеричных чисел. Каждая пара отвечает за насыщенность оттенка своим основным цветом:
- Первая числовая пара – отвечает за красный цвет;
- Вторая пара – за содержание зеленого цвета;
- Последняя – за содержание синего цвета.
В начале кода (перед цифрами ) ставится решетка. Так обозначается шестнадцатеричный цветовой код. Кроме чисел от 1 до 9 в этой системе исчисления используются буквы латинского алфавита (A, B, C, D, E, F).
Например, код белого цвета в html будет иметь вид #FFFFFF :
2. Ключевым словом – сейчас html поддерживает около 147 ключевых слов. Но не все из этих слов являются уникальными. Некоторые из них ссылаются на один и тот же цветовой оттенок.
Серый цвет обозначается двумя ключевыми словами: grey и gray . Их шестнадцатеричный код (HEX ) задается одним и тем же значением #808080 .
Пример :
#808080
3. В формате RGB – эта кодировка цветов в html основана на использовании трех значений, задаваемых в диапазоне от 0 до 255. Каждое из них определяет насыщенность оттенка одним из основных цветов:
- R – красный (red );
- G – зеленый (green );
- B – синий (blue ).
Номер цвета в формате RGB записывается в таком виде: rgb(0, 210, 100).
background-color:rgb(100,186,43)
4. В формате RGBA – он представляет собой усовершенствованный формат RGB , где четвертым значением задается прозрачность цвета в виде десятичной дроби от 0 до 1.
Пример использования:
background-color:rgba(100,86,143,0.2)
background-color:rgba(100,86,143,0.5)
background-color:rgba(100,86,143,0.8)
background-color:rgba(100,86,143,1)
Таблицы цветов html и генераторы цвета
При таком большом разбросе форматов установки цвета легко запутаться. Поэтому была придумана специальная таблица цветов. В ней к 147 ключевым названиям цветовых оттенков приведены коды соответствия во всех основных стандартах представления цвета. Дополнительно каждое поле снабжено планкой для визуального подбора цвета. Одна из таких таблиц представлена на сайте colorscheme.ru :
Но даже с помощью такой структуризации соответствия подбор нужного оттенка может оказаться затруднительным. Да и не факт, что в таблице кодов цветов найдется нужный.
Чтобы обойти эту преграду и максимально упростить подбор нужного оттенка, были разработаны интерактивные веб-сервисы. Их пользовательский интерфейс может несколько разниться между собой.
На сайте html-color-codes.info генератор цветов имеет такой вид:
А в рамках сервиса color-picker.appsmaster.co этот инструмент реализован немного иначе:
Насыщенность каждого цвета в генераторе задается с помощью специальных ползунков. Визуально оттенок отображается цветом рамки и прямоугольника с левой стороны. Внизу в 3 полях отображается цветовой код в основных форматах.
Но генератор цветов доступен не только на специализированных сайтах. Подобным инструментом снабжены почти все графические редакторы. Например, Photoshop :
Техника безопасности при работе с цветом
А было это давно, еще в эпоху видеокарт, поддерживающих всего 256 цветов. В те далекие времена операционные системы могли без искажений отображать лишь определенное количество восьми битных оттенков.
Тогда была выведена великая таблица безопасных цветов. В ней указывалось 216 оттенков, которые могли быть отображены без искажения в любом из браузеров того времени. И по сей день эта «великая рукопись » еще доступна на некоторых ресурсах:
В наше время все изменилось. Поэтому все правила техники безопасности при работе с цветом в html полностью аннулируются. Ведь современное компьютерное железо поддерживает более 16 миллионов различных оттенков. И 216 безопасных цветов канули в лету.
Эти данные полностью подтверждаются статистикой. Судя по ней, в 2014 году всего лишь 0.5% пользователей имеют компьютеры, поддерживающие лишь 256 оттенков.
Основы цветовой гармонии
Природным гармоничным чувством вкуса наделены далеко не все из нас. Поэтому правильный подбор цвета может стать настоящим испытанием. Но, хвала науке, даже цветовую гармонию ей удалось описать в виде нескольких схем. Все они основаны на использовании цветового круга. Схемы гармоничного подбора цветов в html :
- Схема параллельных цветов – когда оба оттенка в цветовом кругу находятся параллельно;
- Триадная схема – в основе всех углов треугольника лежит один из цветов;
- Монохроматическая – когда подбираются несколько близких оттенков одного цвета;
- Аналоговая – более расширенная версия монохроматической схемы. При этом оттенки одного цвета находятся на определенном удалении.
Реализация всех этих схем хорошо представлена в рамках сервиса paletton.com . Он позволяет без труда осуществить гармоничный подбор цвета.
Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из её названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно. Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной системе. Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставят символ решетки #, например #666999. Каждый из трех цветов - красный, зеленый и синий - может принимать значения от 00 до FF. Таким образом, обозначение цвета разбивается на три составляющие #rrggbb, где первые два символа отмечают красную компоненту цвета, два средних - зеленую, а два последних - синюю. Допускается использовать сокращенную форму вида #rgb, где каждый символ следует удваивать. Так, запись #fe0 следует расценивать как #ffee00.
По названию
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Браузеры поддерживают некоторые цвета по их названию. В табл. 1 приведены названия, шестнадцатеричный код, значения в формате RGB, HSL и описание.
| Имя | Цвет | Код | RGB | HSL | Описание |
|---|---|---|---|---|---|
| white | #ffffff или #fff | rgb(255,255,255) | hsl(0,0%,100%) | Белый | |
| silver | #c0c0c0 | rgb(192,192,192) | hsl(0,0%,75%) | Серый | |
| gray | #808080 | rgb(128,128,128) | hsl(0,0%,50%) | Темно-серый | |
| black | #000000 или #000 | rgb(0,0,0) | hsl(0,0%,0%) | Черный | |
| maroon | #800000 | rgb(128,0,0) | hsl(0,100%,25%) | Темно-красный | |
| red | #ff0000 или #f00 | rgb(255,0,0) | hsl(0,100%,50%) | Красный | |
| orange | #ffa500 | rgb(255,165,0) | hsl(38.8,100%,50%) | Оранжевый | |
| yellow | #ffff00 или #ff0 | rgb(255,255,0) | hsl(60,100%,50%) | Желтый | |
| olive | #808000 | rgb(128,128,0) | hsl(60,100%,25%) | Оливковый | |
| lime | #00ff00 или #0f0 | rgb(0,255,0) | hsl(120,100%,50%) | Светло-зеленый | |
| green | #008000 | rgb(0,128,0) | hsl(120,100%,25%) | Зеленый | |
| aqua | #00ffff или #0ff | rgb(0,255,255) | hsl(180,100%,50%) | Голубой | |
| blue | #0000ff или #00f | rgb(0,0,255) | hsl(240,100%,50%) | Синий | |
| navy | #000080 | rgb(0,0,128) | hsl(240,100%,25%) | Темно-синий | |
| teal | #008080 | rgb(0,128,128) | hsl(180,100%,25%) | Сине-зеленый | |
| fuchsia | #ff00ff или #f0f | rgb(255,0,255) | hsl(300,100%,50%) | Розовый | |
| purple | #800080 | rgb(128,0,128) | hsl(300,100%,25%) | Фиолетовый |
С помощью RGB
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Можно определить цвет, используя значения красной, зеленой и синей составляющей в десятичном исчислении. Каждая из трех компонент цвета принимает значение от 0 до 255. Также допустимо задавать цвет в процентном отношении, при этом 100% будет соответствовать числу 255. Вначале указывается ключевое слово rgb , а затем в скобках, через запятую указываются компоненты цвета, например rgb(255, 128, 128) или rgb(100%, 50%, 50%).
RGBA
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Формат RGBA похож по синтаксису на RGB, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.
RGBA добавлен в CSS3, поэтому валидацию CSS-кода надо проводить именно по этой версии. Следует отметить, что стандарт CSS3 еще находится в разработке и некоторые возможности в нем могут поменяться. К примеру, цвет в формате RGB добавленный к свойству background-color проходит валидацию, а добавленный к свойству background уже нет. При этом браузеры вполне корректно понимают цвет для того и другого свойства.
HSL
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Название формата HSL образовано от сочетания первых букв Hue (оттенок), Saturate (насыщенность) и Lightness (светлота). Оттенок это значение цвета на цветовом круге (рис. 1) и задаётся в градусах. 0° соответствует красному цвету, 120° - зелёному, а 240° - синему. Значение оттенка может изменяться от 0 до 359.
Рис. 1. Цветовой круг
Насыщенностью называется интенсивность цвета, измеряется в процентах от 0% до 100%. Значение 0% обозначает отсутствие цвета и оттенок серого, 100% максимальное значение насыщенности.
Светлота задает, насколько цвет яркий и указывается в процентах от 0% до 100%. Малые значения делают цвет темнее, а высокие светлее, крайние значения 0% и 100% соответствуют чёрному и белому цвету.
HSLA
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
Формат HSLA похож по синтаксису на HSL, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.
Значения цвета в форматах RGBA, HSL и HSLA добавлены в CSS3, поэтому при использовании этих форматов проверяйте код на валидность с учётом версии.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Предупреждение
Все перечисленные на сайте методы ловли льва являются теоретическими и базируются на вычислительных методах. Авторы не гарантируют вашей безопасности при их использовании и снимают с себя всякую ответственность за результат. Помните, лев это хищник и опасное животное!
Результат данного примера показан на рис. 2.
Рис. 2. Цвета на веб-странице
Коды Майнкрафт цветов , или же Майнкрафт коды форматирования, позволяют любому игроку добавлять цветы и всячески форматировать текст прямо в Minecraft. Цветовые коды от &0-9 — до &a-f. Добавьте их перед вашим текстом. Сообщения от игроков могут содержать цветовые коды, которые позволяют добавлять краски в ваши предложения.
Цвета и коды форматирования
Знак амперсанта (&), за которым идёт шестнадцатеричное число в сообщения даёт сигнал клиенту для переключения цвета при отображении текста. Кроме того, текст может быть отформатирован с помощью символа &, за которым следует буква. Вы можете добавлять различные цвета в книги, командные блоки, имя сервера, описание сервера (motd), в название миров, в таблички и даже в имена игроков.
Очень легко отформатировать ваш текст в конфигах или в игре, используя таблицу цветов ниже. &r используется для сброса всех кодов, т.е. &mААА&rБББ будет отображаться как ААА БББ.
Представляем таблицу существующих цветовых кодов в Майнкрафт для вашего удобства:
| Код | Название | Тех.Название | Цвет символа | Цвет тени символа | ||||||
|---|---|---|---|---|---|---|---|---|---|---|
| R | G | B | Hex | R | G | B | Hex | |||
| &0 | Черный | black | 0 | 0 | 0 | 000000 | 0 | 0 | 0 | 000000 |
| &1 | Тёмно-синий | dark_blue | 0 | 0 | 170 | 0000AA | 0 | 0 | 42 | 00002A |
| &2 | Тёмно-зелёный | dark_green | 0 | 170 | 0 | 00AA00 | 0 | 42 | 0 | 002A00 |
| &3 | Тёмно-сине-зелёный | dark_aqua | 0 | 170 | 170 | 00AAAA | 0 | 42 | 42 | 002A2A |
| &4 | Тёмно-красный | dark_red | 170 | 0 | 0 | AA0000 | 42 | 0 | 0 | 2A0000 |
| &5 | Тёмно-фиолетовый | dark_purple | 170 | 0 | 170 | AA00AA | 42 | 0 | 42 | 2A002A |
| &6 | Золотой | gold | 255 | 170 | 0 | FFAA00 | 42 | 42 | 0 | 2A2A00 |
| &7 | Серый | gray | 170 | 170 | 170 | AAAAAA | 42 | 42 | 42 | 2A2A2A |
| &8 | Тёмно-серый | dark_gray | 85 | 85 | 85 | 555555 | 21 | 21 | 21 | 151515 |
| &9 | Голубой | blue | 85 | 85 | 255 | 5555FF | 21 | 21 | 63 | 15153F |
| &a | Зелёный | green | 85 | 255 | 85 | 55FF55 | 21 | 63 | 21 | 153F15 |
| &b | Сине-зелёный | aqua | 85 | 255 | 255 | 55FFFF | 21 | 63 | 63 | 153F3F |
| &c | Красный | red | 255 | 85 | 85 | FF5555 | 63 | 21 | 21 | 3F1515 |
| &d | Светло-фиолетовый | light_purple | 255 | 85 | 255 | FF55FF | 63 | 21 | 63 | 3F153F |
| &e | Жёлтый | yellow | 255 | 255 | 85 | FFFF55 | 63 | 63 | 21 | 3F3F15 |
| &f | Белый | white | 255 | 255 | 255 | FFFFFF | 63 | 63 | 63 | 3F3F3F |
Иногда бывает нужно подчеркнуть, зачеркнуть, выделить какой-либо текст . Для этого используется форматирование текста. Используется точно так же как и цвета(перед текстом ставим код , например &lMinecraft = Minecraft.
Для вашего удобства ниже приведена таблица кодов для форматирования:
| Код | Название |
|---|---|
| &k | Магический текст |
| &l | Жирный текст |
| &m | Зачеркнутый текст |
| &n | Подчеркнутый текст |
| &o | Курсивный текст |
| &r | Текст без форматирования |
CSS не понимают). Поэтому будущему веб-мастеру просто необходимо изучить средства HTML, которые позволяют изменять цвет, например для того, чтобы делать яркие и красочные e-mail рассылки, которые будут привлекать внимание целевой аудитории сайта.
Данная запись получилось довольно объемной, но из нее вы узнаете обо всех технических особенностях работы с цветом при помощи HTML. Начнем мы запись с того, что разберемся с вопрос: для чего нам нужно выделять цветом те или иные элементы HTML страницы. Затем мы поговорим про модель RGB, которая позволяет задавать цвета в HTML при помощи специальных кодов (попутно мы рассмотрим десятичные коды задания цвета и шестнадцатеричные значения HTML цветов). Также из данной записи вы узнаете про палитру цвета, а также поймете почему в HTML нет никакой палитры. И завершении этой публикации будут примеры изменения цвета фона, текста и ссылок .
Использование цветов в HTML
Страницы сайта были бы скучными и неинтересными без изображений, про мы говорили ранее и очень подробно. Но у изображений есть один существенный минус: каждое изображение – это дополнительный и, соответственно, дополнительная нагрузка на хостинг.
Отмечу, что для оформления своего WordPress блога я не использовал ни одной картинки, макет полностью оформлен при помощи цвета. Как раз-таки про цвета в HTML мы сегодня с вами и поговорим . Цвета в HTML используются для разных целей, например, мы можем оформлять макеты сайта, выделяя те или иные тем или иным цветом.
При помощи цвета мы можем акцентировать внимание наших посетителей на том или ином тексте или блоке сайта. Отметим, что так же определяется при помощи цвета таким образом, чтобы пользователь мог понять: на какую ссылку он уже нажимал, какую еще не посещал и на какой HTML странице он находится в данный момент.
Будьте аккуратны, используя цвета для оформления HTML документов , не все цвета сочетаются друг с другом и не каждый цвет будет приятен посетителям вашего сайта. Но об этих тонкостях вам лучше спросить у веб-дизайнеров, данная же статья поможет вам разобраться с техническими особенностями, позволяющими управлять цветом элементов HTML страниц.
Но вам не стоит забывать, что оформление должно быть отделено от содержимого, поэтому для манипуляции цветом на HTML страницах лучше использовать CSS, но об этом мы поговорим в другой публикации. Сейчас же мы посмотрим, какие средства есть в HTML для управления цветом на страницах сайта .
В отрасли IT для манипуляции цветом существует множество цветовых моделей. Самая широко распространённая модель представления цвета – это модель RGB. Про некоторые особенности данной модели мы поговорим здесь, а для более детального знакомства с RGB будет отдельная публикация. Ниже вы найдете список цветовых моделей, используемых в IT (не только в HTML и CSS):
- Модель RGB. Данная модель получила очень широкое распространение и, пожалуй, является одним из самых удобных и распространенных способов манипуляции цветом HTML элементов.
- Модель RGBA. Данная модель очень похожа на модель RGB, но включает в себя альфа-канал цвета. Особенность модели RGBA заключается в том, что она позволяет регулировать не только цвет HTML элемента, но и его прозрачность за счет наличия альфа-канала. Модель RGBA была добавлена в CSS3 и не поддерживается старыми браузерами.
- Модель HSL. Особенность модели HSL заключатся в том, что цвет мы задаем при помощи его параметров: оттенка, напыщенности и светлоты. Данная модель несколько более сложная в понимание, чем модель RGB.
- Модель HSLA. Данная модель очень похожа на модель HSL, но она так же, как и модель RGBA позволяет работать с альфа-каналом цвета, поэтому при помощи HSLA мы можем задавать не только цвет HTML элемента на странице, но и его прозрачность.
- Модель HSV (HSB). Данную модель не стоит путать с моделью HSL. Отметим, что первых четыре модели можно использовать в HTML или CSS для оформления веб-страниц, а вот модель HSV – нет. Модель HSV была разработана одним из основателей студии Pixar в 1978 году и очень похожа на HSL.
- Модель CMY или CMYK. Данная модель используется во всех цветных принтерах для печати. В основе модели CMYK лежит правило, заключающиеся в том, что печать происходит на белых листах бумаги. Любой цвет модели CMYK получается из смешения цветов Cyan (бледно-голубой, бирюзовый), Magenta (пурпурный) и желтого. У каждого цвета в модели CMY есть характеристика непрозрачности (количество краски), измеряющаяся в процентах. Но помимо трех перечисленных цветов, модель CMYK использует еще и черный цвет.
Все вышеперечисленные цветовые модели являются аппаратно-зависимыми, то есть если вы задаете цвет HTML элемента при помощи модели RGB или HSL , то нельзя с точностью утверждать, какой именно оттенок цвета увидит посетитель вашего сайта, так как мониторы у всех пользователей разные и передают они цвета по-разному. Также отметим, что в основе всех вышеперечисленных моделей лежит модель RGB и любой цвет, заданный в любой из моделей (кроме HSLA и RGBA из-за наличия альфа-канала), можно конвертировать в RGB.
Если говорить про аппаратно-независимые модели передачи цвета, то стоит отметить модель LAB. Итак, мы немного отвлеклись от работы с цветом в HTML, познакомившись с некоторыми цветовыми моделями. Отметим, что браузеры «понимают» только первых четыре модели: HSL, RGB, HSLA и RGBA. Поэтому цветом HTML элементов мы можем управлять только при помощи этих моделей.
Как формируется цвет HTML элемента: некоторые особенности модели RGB
Давайте разберемся с тем, как формируется цвет HTML элемента и с некоторыми особенностями модели RGB. Отметим, что про модель RGB, а также про другие модели, которые используются для оформления веб-страниц мы поговорим чуть позже в отдельных записях.
Итак, модель RGB расшифровывается, как Red, Green, Blue. В основе модели RGB лежит принцип аддитивности. Этот принцип заключается в том, что для получения какого-либо цвета происходит добавление цвета к черному. Для лучшего понимания представьте, что ваш экран – это черная стена и у вас есть три прожектора: первый светит красным цветом, второй светит зеленым, а третий синим. Яркость каждого прожектора вы можете регулировать при помощи линейки, на которой расположены цифры от 0 до 255. Соответственно, если вы установили для прожектора значение ноль, то он выключается и не светит, если значение 255, то прожектор дает максимально яркий цвет.
Таким образом получается, что если вы светите на одну и ту же точку красным и зеленым прожектором, то на черной стене вы заметите желтое пятно. Если комбинируете красный и синий, то получается пурпурный цвет, а если объединяете зеленый и синий, то световое пятно на черной стене будет цвета Cyan, но если вы направите все три прожектора на одну точку, то световое пятно будет белого цвета.
Описанный выше принцип лежит в основе модели RGB и применяется для манипуляции цветами в HTML элементов на странице в браузере .
HTML атрибуты для изменения цвета элементов: цвет фона элемента и цвет текста внутри элемента
Используются для того, чтобы сделать элементы страницы уникальными. При помощи HTML атрибутов мы можем манипулировать цветом элементов:
- HTML атрибут color. Данный атрибут позволяет изменять цвет текста, находящегося внутри HTML элемента. Атрибут может принимать значения в виде называний HTML цветов и при помощи кодов модели RGB в шестнадцатеричной системе счисления и в десятичной системе счисления. Атрибут color – это уникальный HTML атрибут, который позволяет менять цвет текста внутри некоторых HTML элементов.
- HTML атрибут text. Данный атрибут является уникальным атрибутом тэга . Тэг вместе с тэгами и образуют . Если вы помните, то внутри контейнера размещаются элементы, которые потом отображаются браузером в области просмотра. Атрибут text позволяет задать цвет текста по умолчанию для всей HTML страницы .
- HTML атрибут bgcolor. Также являет уникальным HTML атрибутом и позволяет изменять цвет фона некоторых HTML элементов.
- HTML атрибут vlink. Данный атрибут уникален и применяется только к тэгу , чтобы изменить цвет ссылки, которую уже посетил пользователь.
- HTML атрибут alink. Этот атрибут также уникален и применим только к тэгу . Атрибут alink меняет цвет активной HTML ссылки.
- HTML атрибут link. Атрибут link используется только вместе с тэгом и служит для изменения цвета ссылок HTML страницы, которые еще не посещал пользователь.
Обратите внимание: использовать атрибуты для изменения цвета HTML элементов не рекомендуется, так как есть каскадные таблицы стилей, которые позволяют отделить оформление веб-страницы от его содержимого.
Использование десятичных кодов цвета в HTML
Итак, мы говорили о том, что прожектору можно задавать яркость цвета при помощи специальной линейки, на которой расположены пронумерованные рисочки от 0 до 255. А теперь посмотрим, как это нам поможет изменять цвет HTML элементов. Дело всё в том, что цвет текста внутри HTML элемента или цвет фона в HTML мы можем изменять при помощи десятичного кода следующим образом:
Если вы создадите HTML документ, в котором контейнер body будет описан, как в примере, то увидите:
- Цвет фона HTML документа стал зеленым: bgcolor=”rgb (0,255,0)”.
- Цвет текста HTML страницы станет синим: text=”rgb (0,0,255)”.
- Цвет HTML ссылки, которую пользователь не посещал, будет белым: link=”rgb (255,255,255)”.
- Цветы ссылки, которая открыта в данный момент, будет черным: alink=”rgb (0,0,0)”.
- А цвет HTML ссылки, которую уже посещали, будет красным: vlink=”rgb (255,0,0)”.
Обратите внимание: никто не запрещает вам регулировать «мощность прожектора» по своему усмотрению, вы можете задать HTML цвет , например, таким образом:
rgb (94 , 85 , 50 ) |
И получите цвет детской неожиданности. В этом и заключается особенность, гибкость и удобство модели RGB. Ваш монитор – черная стена, на которую светят прожекторы, а вы можете регулировать мощность этих прожекторов и создавать всевозможные цвета фона, текста и ссылки при помощи HTML атрибутов в десятичной системе счисления или, еще можно сказать: при помощи десятичных кодов цвета .
На самом деле неправильно говорить десятичные коды цвета в HTML , правильнее будет сказать десятичные коды цвета RGB , поскольку данная модель используется не только для оформления веб-страниц в HTML и CSS.
Шестнадцатеричные значения HTML цветов
Задавать цвет HTML элементам десятичными кодами модели RGB не очень удобно (и на данный момент не все браузеры поддерживают такой способ манипуляции цветом), так как запись будет не самая компактная, намного удобнее задавать цвет HTML элементам при помощи шестнадцатеричных значений. На рисунке ниже вы можете увидеть, как десятичные значения конвертируются в шестнадцатеричные.
Для тех, кто не знаком с шестнадцатеричной системой счисления, следует дать небольшое пояснение, чтобы вы без труда могли манипулировать цветом HTML элементов при помощи шестнадцатеричных кодов модели RGB . Во-первых, десятичная система счисления названа так потому, что любое число можно получить комбинацией десяти цифр (терминология важна: между числом и цифрой есть разница): 0, 1, 2, 3, 5, 6, 7, 8, 9.
В шестнадцатеричной системе счисления любое число можно записать при помощи комбинации шестнадцати цифр: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. Для простоты понимания можете считать, что a – это десять, а f – это пятнадцать. Например, число шестнадцать будет записано в шестнадцатеричной системе счисления следующим образом: 10. А число 255 будет записано, как ff.
А теперь давайте посмотрим, как мы можем задавать цвет HTML элементов при помощи шестнадцатеричных значений , повторим наш предыдущий пример, заменив десятичные коды цветов на их шестнадцатеричные аналоги:
< body alink = ”#000000” link=”#ffffff” vlink=”ff0000” bgcolor=”#00ff00” text=”#0000ff”> |
Обратите внимание: запись цвета в HTML в шестнадцатеричном формате несколько компактнее , чем в десятичном, это первое. Второе: мощность каждого прожектора задается числами от 0 до 255. Для записи числа 255 требуется две цифры в шестнадцатеричном формате (ff = 250), поэтому яркость каждого канала цвета (наши прожекторы правильно называть цветовой канал, канал цвета) задается двумя цифрами от 0 до f.
Обратите внимание: яркость каждого канала цвета задается отдельно, но если представить, что это одно число, то максимально возможное число в шестнадцатеричной системе счисления модели RGB равно ffffff, оно даст нам белый цвет, а десятичной системе это: 16 777 215. Такое количество цветов и оттенков позволяет задать/использовать модель RGB . Это число получается из того, что у каждого цветового канала есть 256 значений яркости (от 0 до 255), соответственно: 256*256*256 = 16 777 215.
Шестнадцатеричные значения HTML цветов более компактны и наглядны , большинство веб-дизайнеров и верстальщиков для манипуляции цветом в HTML используют именно шестнадцатеричные значения, поэтому рекомендуем вам не привыкать к десятичной форме записи цвета, а сразу использовать шестнадцатеричную.
Понятно, что начинающему дизайнеру или верстальщику поначалу будет трудно ориентироваться в шестнадцатеричной форме записи цвета, поэтому практически любой графический редактор имеет так называемую палитру цвета, которая позволяет выбрать нужный цвет и получить его код для разных цветовых моделей в разных системах счисления.
Некоторые текстовые редактора, такие как , и имеют расширения-палитры, которые очень удобны, когда вы хотите быстро выбрать цвет и изменить его. Про в этом плане я ничего сказать не могу.
Имена цветов в HTML
HTML атрибуты в качестве значения могут принимать не только десятичные коды и шестнадцатеричные значения , но и специальные имена цветов. Изменять цвет HTML элементов при помощи его имени – не самая удачная затея. Во-первых, за именем цвета в HTML кроется код модели RGB, во-вторых, каждый браузер отображает цвет HTML элемента, заданный при помощи имени, по-разному, это зависит лишь от желания разработчиков браузера.
Поэтому использование имени цвета в HTML не рекомендуется . Модель RGB является аппаратно-зависимой, а цвет, заданный при помощи имени, зависит от браузера и даже его версии. Давайте попробуем задать цвет элементам HTML страницы при помощи имени:
< body alink = ”black ”link = ”#white” vlink=”red” bgcolor=”green” text=”blue”> |
Как вы понимаете, цветов и оттенков очень много. Тут стоит отметить, что HTML атрибуты не позволяют задать градиент, такая возможность есть в CSS, но об этом мы поговорим в другой записи. И для многих цветов в HTML есть имена. Таблицу именем цветов в HTML и их RGB коды вы можете найти на моем сайте.
Таблица сверху демонстрирует какой цвет получит HTML элемент, если вы зададите его при помощи имени . В этой таблице собраны 16 цветов и их имена, которые одобрены консорциумом W3C и должны отображаться одинаково в любом браузере. Но на самом деле в HTML можно использовать порядка 200 имен цвета, которые поддерживают основные браузеры, такие как: Opera, Chrome, Firefox, Safari, Internet Expllorer (на счет последнего данное утверждение очень спорное).
Палитра цвета в HTML
На самом деле в HTML нет никакой палитры цветов . Давайте вспомним определение слова палитра. Палитра – это небольшая тонкая дощечка четырехугольной или овальной формы, на которой художник смешивает краски и получает всевозможные цвета. Иногда в палитре делают отверстие для большого пальца, чтобы ее было удобно держать. Изображение палитры вы найдете ниже. Поэтому в HTML палитры нет.
Но в различных текстовых редакторах есть плагины палитры цвета , которые помогают быстро подобрать цвет HTML элемента . Также палитра цвета есть в графических редакторах, ведь дизайнеру не очень удобно и весело сидеть и высчитывать: какой цвет получится при той или иной яркости того или иного канал. На рисунке ниже вы можете увидеть простейшую палитру редактора Paint.
Отметим, что многие модули и плагины палитры цвета позволяют получить код цвета не только в формате RGB/RGBA, но и в формате других моделей. Запомните, что в HTML палитры нет , ну разве что вы художник до мозга костей и называете палитрой цвета HTML страницы те цвета , которые использовались для ее оформления (ведь иногда палитрой называют цвета, которые использует тот или иной художник, или цвета, которые использовались в создании той или иной картине).
Учимся изменять цвет текста в HTML
Мы получили очень много теории про цвета в HTML , давайте перейдем к практике и попробуем поработать с цветами HTML элементов . Перовое, что мы научимся делать – изменять цвет текста в HTML документе при помощи специальных атрибутов и тэгов. Откройте любой редактор и напишите в нем следующий код:
Учимся работать с цветом в HTML
Меняем цвет текста
Для изменения цвета текста мы можем использовать уникальный атрибут элемента BODY text, а также использовать элемент FONT и его атрибут color. Этот текст будет иметь серый цвет.
< ! DOCTYPE html > < html lang = "ru-RU" > < head > < meta charset = "UTF-8" > < title > ИзменяемцветтекставHTML документе< / title > < link rel = "stylesheet" type = "text/css" href = "style.css" / > < / head > < body text = "#ff0000" > < h1 > < font color = "rgb(0,255,0)" > УчимсяработатьсцветомвHTML < / font > < / h1 > < h2 > < font color = "yellow" > Меняемцветтекста< / font > < / h2 > < p > Дляизмененияцветатекстамыможемиспользоватьуникальный атрибутэлементаBODY text , атакжеиспользоватьэлементFONT < / body > < / html > |
Данный файл я сохраню, как color.html и посоветую вам не забывать про . Запись цвета в десятичной системе счисления не поддерживает Chrome, Firefox и Opera, а вот IE такую запись цвета понимает и подсвечивает HTML заголовок зеленым цветом:
Правильно говорить не изменение цвета текста в HTML, а изменение цвета шрифта в HTML. Про
Компьютерные игры - это один из самых популярных способов интересно провести свободное время. Погружаясь в мир видеоигры, мы забываем о реальных проблемах и неприятностях, расслабляемся и получаем удовольствие. А если это онлайн-игра или игра в мультиплеерном режиме, тогда ее главный плюс заключается в том, что здесь можно познакомиться со множеством людей со всех уголков мира и найти не просто единомышленников, но и лучших друзей. Хотите узнать, как настройки игры, вплоть до цвета в "МТА", могут повлиять на ваше общение с другими игроками? Читайте дальше!
Особенности мультиплеерного режима
Задавались ли вы вопросом: как настраивать цвета в "МТА" или в какой-то другой игре? Никто из людей, хоть раз имевших возможность поиграть в онлайн-игру с большим количеством игроков, не станет отрицать, что перед другими хочется показать себя в лучшем свете. Можно похвастаться особенными, дорогими вещами своего персонажа, выделиться в знании игровой терминологии или же просто настроить интерфейс своей игры так, что она будет работать качественнее, чем у неопытных геймеров.
Цвета в "МТА" - что нужно знать?
Если говорить об одной из версий мультиплеерного режима игры "ГТА: Сан Андреас", "МТА", то здесь очень важную роль играет цвет. Умение настраивать для своего ника цвет в "МТА" является одним из лучших навыков, который стоит приобрести каждому начинающему игроку.
Итак, чтобы настроить цвет ника, зайдите в приложение "МТА: СА" и нажмите на опцию Settings, далее выбирайте свое имя, а затем прямо перед ним вводите нужный код цвета. В "МТА" существует большая палитра цветов для ников. В статье мы вставили образцы палитр, из которых можно выбрать понравившийся оттенок.
Теперь вы знаете, каким образом можно выделиться и сделать ваш ник непохожим на ники новичков и неопытных игроков. Яркий, он будет выделять вас среди обычных геймеров и привлекать к вам больше внимания. Приятной вам игры!
