본문 바로가기
StackOverflow

[HTML] bgcolor로 "chucknorris" 를 설정하면 붉은 색이 나오는 이유?

StanleyKou 2015. 12. 8. 13:42

http://stackoverflow.com/questions/8318911/why-does-html-think-chucknorris-is-a-color?rq=1


Q: 왜 HTML의 bgcolor로 "chucknorris" 를 설정하면 붉은 색이 나오는거죠? (질문자: user456584)


A: 넷스케이프 시절에서 이어져 내려온 유산입니다. (역주: 척노리스에게만 할당된 색상이 아니라니 아쉽네요)

chucknorris 은 c00c0000000 으로 인식됩니다. (역주: HexString으로, A~F까지의 글자를 16진수로 인식)

그 다음 전체 글자길이를 3으로 나눠 c00c 0000 0000 으로 만들고,

이 글자는 RGB (c00c, 0000, 0000) 으로 간주되며, 색상의 범위는 0x00 ~ 0xFF 까지라서 2글자씩만 남깁니다.

RGB (c0, 00, 00) -> RGB (192, 0, 0) == 붉은 색입니다.

참고로 chucknorr 이 노란색으로 나오는 이유는 같은 과정을 거쳐, 

c00c00000 => c00 c00 000 => c0 c0 00 [RGB(192, 192, 0)] 가 되기 때문입니다.


(답변자: dash)




up vote3349down votefavorite
971

How come certain random strings produce various colors when entered as background colors in HTML? For example:

<body bgcolor="chucknorris"> test </body>

...produces a document with a red background across all browsers and platforms.

Interestingly, while chucknorri produces a red background as well, chucknorr produces a yellow background.

What's going on here?

 
shareeditflag

protected by BoltClock♦ Feb 6 '13 at 14:22

This question is protected to prevent "thanks!", "me too!", or spam answers by new users. To answer it, you must have earned at least 10 reputation on this site.




_




3089down voteaccepted
+50

It's a holdover from the Netscape days:

Missing digits are treated as 0[...]. An incorrect digit is simply interpreted as 0. For example the values #F0F0F0, F0F0F0, F0F0F, #FxFxFx and FxFxFx are all the same.

From this blog post, which covers it in great detail, including varying lengths of color values, etc.

If we apply the rules in turn from the blog post, we get the following:

  1. Replace all non valid hexadecimal characters with 0's

    chucknorris becomes c00c0000000

  2. Pad out to the next total number of characters divisible by 3 (11 -> 12)

    c00c 0000 0000

  3. Split into three equal groups, with each component representing the corresponding colour component of an RGB colour:

    RGB (c00c, 0000, 0000)

  4. Truncate each of the arguments from the right down to 2 characters

Which gives the following result:

RGB (c0, 00, 00) = #C00000 or RGB(192, 0, 0)

Here's an example demonstrating the bgcolor attribute in action, to produce this "amazing" colour swatch:

<table>
  <tr>
    <td bgcolor="chucknorris" cellpadding="8" width="100" align="center">chuck norris</td>
    <td bgcolor="mrt" cellpadding="8" width="100" align="center" style="color:#ffffff">Mr T</td>
    <td bgcolor="ninjaturtle" cellpadding="8" width="100" align="center" style="color:#ffffff">ninjaturtle</td>
  </tr>
  <tr>
    <td bgcolor="sick" cellpadding="8" width="100" align="center">sick</td>
    <td bgcolor="crap" cellpadding="8" width="100" align="center">crap</td>
    <td bgcolor="grass" cellpadding="8" width="100" align="center">grass</td>	                
  </tr>
</table>

This also answers the other part of the question; why does bgcolor="chucknorr" produce a yellow colour? Well, if we apply the rules, the string is:

c00c00000 => c00 c00 000 => c0 c0 00 [RGB(192, 192, 0)]

Which gives a light yellow gold colour. As the string starts off as 9 characters, we keep the second C this time around hence it ends up in the final colour value.

I originally encountered this when someone pointed out you could do color="crap" and it, well, comes out brown.

shareeditflag


'StackOverflow ' 카테고리의 다른 글

[Linux] 전체 시스템에서, 특정 스트링을 포함하는 파일 찾기  (0) 2015.12.10
[HTML] 웹 브라우저에 입력할 수 있는 URL의 길이?  (0) 2015.12.09
[C] --> 오퍼레이터를 뭐라고 부르죠?  (0) 2015.12.04
[C] C언어에서, 메모리 포인터를 해제하기 전에 캐스팅해야 하는 이유?  (0) 2015.12.04
[Javascript] 구글 캘린더나 구글 독스에서 수신한 JSON 데이터에 while(1); 이나 &&START&& 같은 코드가 들어있는 이유  (0) 2015.11.30

'StackOverflow ' Related Articles

티스토리툴바