Murga

個人的に言いたいコト・主張・気持ち。

HTML に「Chuck Norris カラー」がある?

ホームページ辞典 第6版 HTML・CSS・JavaScript

ホームページ辞典 第6版 HTML・CSS・JavaScript

「HTML で ChuckNorris (チャック・ノリス) ってカラー名が使えるんだけどなに?」という StackOverflow の質問があった。

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

これでどうも #c00000 と同じ色になるようだ。

不思議な挙動だが、こうなるのには理由があって、ちゃんと回答もあった。

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.

つまり、大昔はネットスケープ時代にできた仕様で、カラーコードに不正な文字列が混じっているとそれを 0 と見なして解釈するようだ。

chucknorris becomes c00c0000000

chucknorris という文字列は c00c0000000 と見なされ、RGB で4桁ずつ区切られ、各4桁の右2桁がちぎられて、最終的に #c00000 というカラーコードとして扱われるのだ。

コレを応用すれば、abcdef のいずれかを含んだ単語を組み合わせて、「なぜかカラーリングされる不思議な HTML」が書ける。

See the Pen Chuck Norris = Red by Neos21 (@Neos21) on CodePen.

文字列を3等分し、16進数で解釈できない文字が 0 扱いになることを考えながら単語を構成するの楽しい。

ちなみに CSS では使えない。HTML の bgcolor 属性とかでのみ使える、懐かしの技。