Цвета шестиугольника: числовое представление для "прозрачного"?
Я создаю веб-CMS, в которой пользователь может выбирать цвета для определенных элементов сайта.
Я хотел бы преобразовать все значения цвета в шестнадцатеричные, чтобы избежать дальнейших сбоев форматирования ( "rgb (x, y, z)" или именованных цветов). Я нашел для себя хорошую библиотеку JS.
Единственное, что я не могу получить в hex, является "прозрачным". Мне нужно это, когда явным образом объявляю элемент прозрачным, что в моем опыте может отличаться от того, чтобы не определять какое-либо значение вообще.
Кто-нибудь знает, можно ли это превратить в некоторую числовую форму? Должен ли я настроить все экземпляры обработки для принятия шестнадцатеричных значений или "прозрачных"? Я не могу думать иначе.
Ответы
Ответ 1
Прозрачность - это свойство вне самого цвета, также называемое компонентом alpha
. Вы не можете закодировать его как RGB.
Если вы хотите прозрачный фон, вы можете сделать это:
background: transparent;
Кроме того, я не знаю, может ли это быть полезным или нет, но вы можете установить свойство opacity
:
.half{
opacity: 0.5;
filter: alpha(opacity=50);
}
Вам нужны оба, чтобы заставить его работать в IE и всех других достойных браузерах.
Ответ 2
Альфа-канал определяет значение прозрачности для цвета, поэтому любой цвет на 100% прозрачен, если значение альфа-значения равно 0. Обычно этот четырехканальный тип цвета известен как RGBA.
Вы можете указать RGBA в CSS так:
div {
background: rgba(200, 54, 54, 0.5); /* 50% transparent */
}
Обратите внимание, что не все браузеры поддерживают RGBA, и в этом случае вы можете указать резервную копию:
div {
background: rgb(200, 54, 54); /* fallback */
background: rgba(200, 54, 54, 0.5); /* 50% transparent */
}
Более подробную информацию о поддержке и обходах браузера можно найти здесь.
Ответ 3
HEXA - #RRGGBBAA
Существует относительно новый способ прозрачности, который называется HEXA (HEX + Alpha). Он занимает 8 цифр вместо 6. Последняя пара - Alpha. Таким образом, паттерн пары #RRGGBBAA. Также работает 4 цифры: #RGBA
Я пока не уверен в поддержке браузера, но вы можете проверить DRAFT Docs для получения дополнительной информации.
§ 4.2. Шестнадцатиричные обозначения RGB: #RRGGBB
Синтаксисом <hex-color>
является токен <hash-token>
, значение которого состоит из 3, 4, 6 или 8 шестнадцатеричных цифр. Другими словами, шестнадцатеричный цвет записывается как хэш-символ, "#", за которым следует некоторое количество цифр 0-9
или буквы a-f
(случай букв не имеет значения - #00ff00
идентичен #00ff00
).
8 цифр
Первые 6 цифр интерпретируются одинаково с 6-значным обозначением. Последняя пара цифр, интерпретируемая как шестнадцатеричное число, указывает альфа-канал цвета, где 00
представляет полностью прозрачный цвет, а ff
представляет полностью непрозрачный цвет.
Пример 3
Другими словами, #0000ffcc
представляет тот же цвет, что и rgba(0, 0, 100%, 80%)
(слегка прозрачный синий).
4 цифры
Это более короткий вариант восьмизначной нотации, "расширенный" таким же образом, как и трехзначное обозначение. Первая цифра, интерпретируемая как шестнадцатеричное число, указывает красный канал цвета, где 0
представляет минимальное значение, а f
представляет максимум. Следующие три цифры представляют зеленый, синий и альфа-каналы соответственно.
По большей части Chrome и Firefox начали поддерживать это:
![введите описание изображения здесь]()
Ответ 4
Вы можете использовать эту таблицу преобразования: http://roselab.jhu.edu/~raj/MISC/hexdectxt.html
например, если вы хотите прозрачность 60%, вы используете 3C (шестнадцатеричный эквивалент).
Это полезно для прозрачности градиента фона IE:
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3C545454, endColorstr=#3C545454);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3C545454, endColorstr=#3C545454)";
где startColorstr и endColorstr: 2 первых символа являются шестнадцатеричным значением для прозрачности, а шесть остальных - шестнадцатеричным.
Ответ 5
Для этого существуют два общих подхода: либо зарезервировать определенный цвет как "прозрачный", и в этом случае вы не можете использовать этот цвет в изображениях без прозрачности или определить четвертый канал рядом с красным, зеленым и синим цветом "альфа", которая указывает на прозрачность/прозрачность.
Ответ 6
Используйте следующий шестнадцатеричный код для прозрачного цвета текста: # 00FFFF00
Ответ 7
Я также пытался прозрачно - возможно, вы могли бы попробовать оставить значение фона, например. что-то вроде
bgcolor=" "