Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
203 views
in Technique[技术] by (71.8m points)

html - HTML为什么认为“ chucknorris”是一种颜色?(Why does HTML think “chucknorris” is a color?)

How come certain random strings produce colors when entered as background colors in HTML?

(在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.

(有趣的是,虽然chucknorri产生红色背景,但chucknorr产生黄色背景。)

What's going on here?

(这里发生了什么?)

  ask by user456584 translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

It's a holdover from the Netscape days:

(这是Netscape时代的遗留物:)

Missing digits are treated as 0[...].

(丢失的数字被视为0 [...]。)

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

(不正确的数字将被简单地解释为0。例如,值#F0F0F0,F0F0F0,F0F0F,#FxFxFx和FxFxFx都相同。)

It is from the blog post A little rant about Microsoft Internet Explorer's color parsing which covers it in great detail, including varying lengths of color values, etc.

(它来自博客文章关于Microsoft Internet Explorer的颜色解析的一点怨言,其中涵盖了非常详细的内容,包括不同长度的颜色值等。)

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

(如果我们从博客文章中依次应用规则,则会得到以下信息:)

  1. Replace all nonvalid hexadecimal characters with 0's

    (将所有无效的十六进制字符替换为0)

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

    (填充到下一个可被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颜色的相应颜色分量:)

     RGB (c00c, 0000, 0000) 
  4. Truncate each of the arguments from the right down to two 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:

(这是一个演示bgcolor属性的示例,以产生此“惊人的”颜色样本:)

 <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?

(为什么bgcolor="chucknorr"产生黄色?)

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.

(由于字符串以9个字符开头,因此我们这次保留了第二个C,因此最终以最终的颜色值结束。)

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

(我最初遇到此问题的原因是有人指出您可以进行color="crap" ,结果它变成棕色。)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...