преобразовать в трехзначный шестнадцатеричный цветовой код - PullRequest
11 голосов
/ 22 сентября 2009

Я давно использую трехзначные шестнадцатеричные значения цвета в CSS: #fff, #999, #069 и т. Д. Я могу видеть, как повторяющиеся буквы / цифры объединяются, чтобы создать 3 -разрядный шестнадцатеричный цветовой код, но я не совсем понимаю шаблон, чтобы можно было написать конвертер в PHP. Есть ли для этого документация?

Редактировать: О, возможно, мой вопрос не был ясен. Мне нужно знать, как некоторые из 6-значных шестнадцатеричных значений цвета преобразуются в 3-значные. xxxxxx (ffffff) и xxyyzz (006699) - это единственные две модели, верно?

Ответы [ 4 ]

31 голосов
/ 22 сентября 2009

Чтобы преобразовать 3-символьный шестнадцатеричный код в 6-значный, необходимо повторить каждый символ:

$hex = '#fff';
$hex6 = '#' . $hex[1] . $hex[1] . $hex[2] . $hex[2] . $hex[3] . $hex[3];

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

2 голосов
/ 22 сентября 2009

#f0f расширен до #ff00ff, так что в основном вам просто нужно вычислить значение и значение умножить на 16 для каждого символа, например ::100100

#f98: f = 15 => красный = 15 + 15 * 16 = 255 и т. Д.

2 голосов
/ 22 сентября 2009

3-значный код CSS является коротким для 6 цифр ": # 06a; is # 0066aa;
Каждые две цифры представляют число от 0 до 255.
Преобразование этих значений в шестнадцатеричное и обратно - все, что вам нужно.

1 голос
/ 11 ноября 2015

function hexfix(str) {
  var v, w;
  v = parseInt(str, 16);	// in rrggbb
  if (str.length == 3) {
    // nybble colors - fix to hex colors
	//  0x00000rgb              -> 0x000r0g0b
	//  0x000r0g0b | 0x00r0g0b0 -> 0x00rrggbb
	w = ((v & 0xF00) << 8) | ((v & 0x0F0) << 4) | (v & 0x00F);
	v = w | (w << 4);
  }
  return v.toString(16).toUpperCase();
 }

var hex1 = 'AABBCC',
    hex2 = 'ABC';

document.body.appendChild(document.createTextNode(hex1+" becomes "+hexfix(hex1)+'.  '));
document.body.appendChild(document.createTextNode(hex2+" becomes "+hexfix(hex2)+'.  '));

Как то так.

...