如何计算bgcolor属性?

37 html colors

可能重复:
为什么HTML认为"chucknorris"是一种颜色?

bgcolor财产是如何计算的?

当我使用以下HTML代码时......

<body bgcolor="#Deine Mutter hat eine Farbe und die ist grün."></body>
Run Code Online (Sandbox Code Playgroud)

...我得到的是以下颜色.

#Deine Mutter hat eine Farbe und dieistgrün.

顺便说一句:当我尝试在CSS中使用它时,它将无法工作并将应用标准颜色:

body{
    color: #IchwillGOLD;
}
Run Code Online (Sandbox Code Playgroud)

为什么?

Jas*_*per 17

我对此的第一次尝试是对错误的一点尝试,虽然我发现了一些有趣的系统属性,但还不足以形成答案.接下来,我把注意力转向标准.我认为这是标准的原因是我在三种不同的浏览器上测试它们实际上都做了同样的事情.使用标准我发现了会发生什么:

  1. 所有非十六进制的字符都被零替换(因此只有零,1-9和ae保留)
  2. 该字符串在末尾为零填充为三的倍数
  3. 然后将该字符串分成三个相等的部分,每个部分代表一种颜色
  4. 如果结果字符串超过8个字符,请取每个字符串的最后8个字符
  5. 只要每个字符串以零开头,第一个字符就会从每个字符串中删除(因为它开始于此特定字符串不会发生 De
  6. 前两个字符取自每个字符串并转换为数字,用作颜色的一个组成部分

这样你就会看到你得到00FA00Deine Mutter hat eine Farbe und die ist grün.

html5标准更准确地描述了这个过程,实际上在这里描述了几个案例:http://www.w3.org/TR/html5/common-microsyntaxes.html#colors在"解析遗留颜色值的规则"下

  • 此外,根据http://www.w3.org/TR/CSS21/cascade.html#preshint,这些表示属性最终被转换为其相应的CSS规则,具有零作者级特异性,这就是为什么WebKit,例如,将结果颜色值传递给`CssColor`结构. (2认同)

pce*_*pce 8

正如我在评论中所说,HTMLParser将其添加为CSS属性,并且已经由Jasper回答,它是由规范.

履行

Webkit解析HTMLParser.cpp中的html,如果Parser是inBody,它会在HTMLBodyElement.cpp中将bgColor属性添加为CssColor

// Color parsing that matches HTML's "rules for parsing a legacy color value"
void HTMLElement::addHTMLColorToStyle(StylePropertySet* style, CSSPropertyID propertyID, const String& attributeValue)
{
    // An empty string doesn't apply a color. (One containing only whitespace does, which is why this check occurs before stripping.)
    if (attributeValue.isEmpty())
        return;

    String colorString = attributeValue.stripWhiteSpace();

    // "transparent" doesn't apply a color either.
    if (equalIgnoringCase(colorString, "transparent"))
        return;

    // If the string is a named CSS color or a 3/6-digit hex color, use that.
    Color parsedColor(colorString);
    if (!parsedColor.isValid())
        parsedColor.setRGB(parseColorStringWithCrazyLegacyRules(colorString));

    style->setProperty(propertyID, cssValuePool().createColorValue(parsedColor.rgb()));
}
Run Code Online (Sandbox Code Playgroud)

你有很好的机会以这种方式结束:

static RGBA32 parseColorStringWithCrazyLegacyRules(const String& colorString)
Run Code Online (Sandbox Code Playgroud)

我认为这是支持传统的颜色:body bgcolor = ff0000(Mozilla Gecko Test).

  1. 跳过领先#
  2. 抓取前128个字符,用0. 1120替换非十六进制字符
  3. 非BMP字符被替换为"00",因为它们在字符串中显示为两个"字符".
  4. 如果没有数字返回颜色黑色
  5. 将数字拆分为三个组件,然后搜索每个组件的最后8位数.

Webkit/HTMLElement.cpp代码:parseColorStringWithCrazyLegacyRules:

static RGBA32 parseColorStringWithCrazyLegacyRules(const String& colorString)
{
    // Per spec, only look at the first 128 digits of the string.
    const size_t maxColorLength = 128;
    // We'll pad the buffer with two extra 0s later, so reserve two more than the max.
    Vector<char, maxColorLength+2> digitBuffer;
    size_t i = 0;
    // Skip a leading #.
    if (colorString[0] == '#')
        i = 1;

    // Grab the first 128 characters, replacing non-hex characters with 0.
    // Non-BMP characters are replaced with "00" due to them appearing as two "characters" in the String.
    for (; i < colorString.length() && digitBuffer.size() < maxColorLength; i++) {
        if (!isASCIIHexDigit(colorString[i]))
            digitBuffer.append('0');
        else
            digitBuffer.append(colorString[i]);
    }

    if (!digitBuffer.size())
        return Color::black;

    // Pad the buffer out to at least the next multiple of three in size.
    digitBuffer.append('0');
    digitBuffer.append('0');

    if (digitBuffer.size() < 6)
        return makeRGB(toASCIIHexValue(digitBuffer[0]), toASCIIHexValue(digitBuffer[1]), toASCIIHexValue(digitBuffer[2]));

    // Split the digits into three components, then search the last 8 digits of each component.
    ASSERT(digitBuffer.size() >= 6);
    size_t componentLength = digitBuffer.size() / 3;
    size_t componentSearchWindowLength = min<size_t>(componentLength, 8);
    size_t redIndex = componentLength - componentSearchWindowLength;
    size_t greenIndex = componentLength * 2 - componentSearchWindowLength;
    size_t blueIndex = componentLength * 3 - componentSearchWindowLength;
    // Skip digits until one of them is non-zero, 
    // or we've only got two digits left in the component.
    while (digitBuffer[redIndex] == '0' && digitBuffer[greenIndex] == '0' 
        && digitBuffer[blueIndex] == '0' && (componentLength - redIndex) > 2) {
        redIndex++;
        greenIndex++;
        blueIndex++;
    }
    ASSERT(redIndex + 1 < componentLength);
    ASSERT(greenIndex >= componentLength);
    ASSERT(greenIndex + 1 < componentLength * 2);
    ASSERT(blueIndex >= componentLength * 2);
    ASSERT(blueIndex + 1 < digitBuffer.size());

    int redValue = toASCIIHexValue(digitBuffer[redIndex], digitBuffer[redIndex + 1]);
    int greenValue = toASCIIHexValue(digitBuffer[greenIndex], digitBuffer[greenIndex + 1]);
    int blueValue = toASCIIHexValue(digitBuffer[blueIndex], digitBuffer[blueIndex + 1]);
    return makeRGB(redValue, greenValue, blueValue);
}
Run Code Online (Sandbox Code Playgroud)