如何计算bgcolor属性?

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

如何计算bgcolor属性?

当我使用下面的HTML代码...

<body bgcolor="#Deine Mutter hat eine Farbe und die ist grün."></body>

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

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

body{
    color: #IchwillGOLD;
}

为什么?


我的第一个尝试就是对错误进行一点试验,虽然我发现系统有一些有趣的属性,但还不足以形成答案。 接下来,我将注意力转向标准。 我相信这是标准的原因是我在三个不同的浏览器上测试了它们,并且他们实际上都做了同样的事情。 使用标准我发现了会发生什么:

  • 所有不是十六进制的字符都被替换为零(因此只有零,1-9和ae保留)
  • 该字符串在末尾填充为零是三的倍数
  • 然后将字符串分成三部分,每部分代表一种颜色
  • 如果结果字符串长于8个字符,则取每个字符串的最后8个字符
  • 只要每个字符串以零开头,第一个字符就会从每个字符串中移除(对于此特定字符串不会发生,因为它始于De
  • 前两个字符取自每个字符串,并转换为数字以用作颜色的组成部分之一
  • 通过这种方式,你会看到你得到00FA00 Deine Mutter hat eine Farbe und die ist grün. 00FA00 Deine Mutter hat eine Farbe und die ist grün.

    html5标准更准确地描述了这个过程,并且在这里描述了更多的情况:http://www.w3.org/TR/html5/common-microsyntax.html#colors“解析遗留颜色值的规则”


    正如我在评论中所述,HTMLParser将它添加为一个CSS属性,并且Jasper已经回答了,它是通过规范。

    履行

    Webkit解析HTMLParser.cpp中的html,如果Parser在inBody中,它将bgColor属性添加为HTMLBodyElement.cpp中的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()));
    }
    

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

    static RGBA32 parseColorStringWithCrazyLegacyRules(const String& colorString)
    

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

  • 跳过领先#
  • 抓住前128个字符,用0.1120替换非十六进制字符
  • 非BMP字符被替换为“00”,因为它们在字符串中显示为两个“字符”。
  • 如果没有数字返回颜色黑色
  • 将数字拆分为三个组件,然后搜索每个组件的最后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);
    }
    
    链接地址: http://www.djcxy.com/p/2515.html

    上一篇: How is the bgcolor property being calculated?

    下一篇: How do I know what correct HTML code looks like