Wrox Programmer Forums
|
CSS Cascading Style Sheets All issues relating to Cascading Style Sheets (CSS).
Welcome to the p2p.wrox.com Forums.

You are currently viewing the CSS Cascading Style Sheets section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old April 15th, 2007, 09:26 AM
Authorized User
 
Join Date: Jun 2003
Posts: 11
Thanks: 0
Thanked 0 Times in 0 Posts
Default CSS Color Codes

The URL http://www.w3schools.com/css/css_colornames.asp lists color codes to be used in CSS. In Richard York's book, CSS instantresults, he uses "solid gray." I couldn't find that color in the list at the URL but it "Seems" to work.

What happening?

 
Old April 15th, 2007, 09:37 AM
Friend of Wrox
 
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
Default

You can use the hex number of any color you can think of. If you mean named colors, only the 16 color names listed here can be used.
http://www.w3.org/TR/CSS2/syndata.html#value-def-color

While most browsers do understand the so called Netscape colors listed at the w3schools page, they shouldn't be used. The names for them, that is. Use the hex codes all you want. :)

--
http://yupapa.com
 
Old April 15th, 2007, 09:44 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Could it be that he said this while discussion a property like border?

In that case, solid could be referring to the type of border, and gray to the actual color. E.g.:

border: 1px solid gray;

would create a solid border with a width of 1px.

I don't have the book so I can't check...

Imar


---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.
 
Old April 15th, 2007, 09:46 AM
Friend of Wrox
 
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
Default

Good thinking! I bet that's it. :)

--
http://yupapa.com
 
Old April 15th, 2007, 10:20 AM
Authorized User
 
Join Date: Jun 2003
Posts: 11
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Yes, the command is border: 1px solid gray; so the solid does relate to the border size, not the color. Just one of the newbie "Don't" know it all. Thanks...

 
Old April 15th, 2007, 10:33 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Well, almost. It refers to the border *style*, not the border size. That's what the 1px does.

border: 1px solid gray;

is actually short hand for setting the border-width, border-style and border-color all at once. It also does that for all four sides of the element you're styling.

An easier to understand, but much larger and more difficult to maintain equivalent would be:

border-top-color: Gray;
border-top-style: solid;
border-top-width: 1px;

border-right-color: Gray;
border-right-style: solid;
border-right-width: 1px;

border-bottom-color: Gray;
border-bottom-style: solid;
border-bottom-width: 1px;

border-left-color: Gray;
border-left-style: solid;
border-left-width: 1px;

which sets all 12 properties individually.

For more info, take a look here: http://www.w3.org/TR/REC-CSS1#border-style

Cheers,

Imar

---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.
 
Old April 15th, 2007, 01:52 PM
richard.york's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

Quote:
quote:
While most browsers do understand the so called Netscape colors listed at the w3schools page, they shouldn't be used. The names for them, that is. Use the hex codes all you want.
In my testing the named colors work just fine. All of them, in every browser. So I don't understand why you would recommend not using them. And they are an official standard now, being as they are in the W3C CSS3 color spec (a Candidate Recommendation).

http://www.w3.org/TR/2003/CR-css3-color-20030514/

The colors in my book came straight out of that spec.

The only ones that have known issues has to do with using the American English vs. the British English spelling of "gray/grey" in standards-compliant mode in IE6. I don't remember exactly which one works and which one doesn't but it's an IE bug, and affects some of the color keywords which include the word gray.

Regards,
Rich

--
Author,
Beginning CSS: Cascading Style Sheets For Web Design, 2nd Edition
CSS Instant Results

http://www.catb.org/~esr/faqs/smart-questions.html
 
Old October 2nd, 2007, 04:15 AM
Registered User
 
Join Date: Oct 2007
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Default

There's a very informative article on CSS Color Codes at: http://www.imventurer.com/2007/09/24/css-color-codes/

You can use the color wheel to find any color's Hex value, and there are 16 colors listed that can be specified 'by name' as well.

Hope this helps.

My Blog: http://www.imventurer.com
 
Old October 11th, 2007, 03:11 AM
Registered User
 
Join Date: Oct 2007
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Default

here's some code I found a while back that can help you calculate your colours as wel !

just paste it in a new HTML-file !

The link from imventurer is very handy as well !!

Code:
<html>
<body>

<script type="text/javascript">



function updateHex()
{
    var red = parseInt(document.forms.colorcalc.red.value);
    var green = parseInt(document.forms.colorcalc.green.value);
    var blue = parseInt(document.forms.colorcalc.blue.value);
    document.forms.colorcalc.hexcolor.value =
      "#" + Color2Hex(red)+Color2Hex(green)+Color2Hex(blue);
}

function Color2Hex(n)
{
    return ToHex(n >> 4) + ToHex(n);
}

function ToHex(n)
{
    n = n % 16;

    if (n <= 0)
        return "0";

    if (n < 10)
        return n.toString();

    if (n == 10)
        return "A";

    if (n == 11)
        return "B";

    if (n == 12)
        return "C";

    if (n == 13)
        return "D";

    if (n == 14)
        return "E";

    if (n == 15)
        return "F";
}    

function CheckDecimal(s)
{
    var n = parseInt(s);
    var i, c;

    for (i = 0; i < s.length; ++i)
    {
        c = s.charAt(i);

        if (c < '0' || '9' < c)
        {
            alert("Please enter a value between 0 and 255");
            return false;
        }
    }

    if (n < 0 || 255 < n)
    {
        alert("Please enter a value between 0 and 255");
        return false;
    }

    return true;
}

function CheckHex(s)
{
    if (!isHexColor(s))
    {
        alert("Please enter a value starting with '#' followed" +
        "\nby 6 hexadecimal digits, for example: #00FF66");
        return false;
    }

    return true;
}

function isHexColor(s)
{
    var i, c;

    if (s.charAt(0) != '#' || s.length != 7)
        return false;

    for (i = 1; i < 7; ++i)
    {
        c = s.charAt(i);

        if ('0' <= c && c <= '9')
            continue;

        if ('A' <= c && c <= 'F')
            continue;

        if ('a' <= c && c <= 'f')
            continue;

        return false;  // bad character
    }

    return true;
}

function updateRGB()
{
    var s = document.forms.colorcalc.hexcolor.value;

    if (CheckHex(s))
    {
        var red = HexColor2Decimal(s, 1);
        var green = HexColor2Decimal(s, 3);
        var blue = HexColor2Decimal(s, 5);
        document.forms.colorcalc.red.value = red.toString();
        document.forms.colorcalc.green.value = green.toString();
        document.forms.colorcalc.blue.value = blue.toString();
    }
}

function HexColor2Decimal(s, n)
{
    return 16 * HexDigit2Dec(s.charAt(n))
            + HexDigit2Dec(s.charAt(n+1));
}

// called with hex character
function HexDigit2Dec(hex)
{
    if ('0' <= hex && hex <= '9')
        return parseInt(hex);

    if (hex == 'A' || hex == 'a')
        return 10;

    if (hex == 'B' || hex == 'b')
        return 11;

    if (hex == 'C' || hex == 'c')
        return 12;

    if (hex == 'D' || hex == 'd')
        return 13;

    if (hex == 'E' || hex == 'e')
        return 14;

    if (hex == 'F' || hex == 'f')
        return 15;
    return 0;
}



</script>

<center>
<form name="colorcalc" action="">
<table border="0" cellspacing="0" cellpadding="3">
<caption>Enter RGB or Hex value and press appropriate button to
convert</caption>

<tr>
<td class="shaded" align="right">red:</td>
<td class="shaded"><input name="red" size="4" maxlength="3"
value="255" onblur="CheckDecimal(this.value)"></td>
<td class="shaded" align="center">Hex color value</td>
</tr>

<tr>
<td class="shaded" align="right">green:</td>
<td class="shaded"><input name="green" size="4" maxlength="3"
value="255" onblur="CheckDecimal(this.value)"></td>
<td class="shaded"><input name="hexcolor" size="8" maxlength="7"
value="#FFFFFF" onblur="CheckHex(this.value)"></td>
</tr>

<tr>
<td class="shaded" align="right">blue:</td>
<td class="shaded"><input name="blue" size="4" maxlength="3"
value="255" onblur="CheckDecimal(this.value)"></td>
<td class="shaded" align="center"><input type="button" value="HEX?"
onclick="updateHex()"><input type="button" value="RGB?"
onclick="updateRGB()"></td>
</tr>
</table>
</form>
</center>

<table border="1" cellpadding="2" cellspacing="0" width="100%">

<tr>
<td nowrap="nowrap" style="background-color:#FFFFFF;color:black">
FFF
FFF</td>
<td nowrap="nowrap" style="background-color:#CCCCCC;color:black">
CCC
CCC</td>
<td nowrap="nowrap" style="background-color:#999999;color:black">
999
999</td>
<td nowrap="nowrap" style="background-color:#666666;color:white">
666
666</td>
<td nowrap="nowrap" style="background-color:#333333;color:white">
333
333</td>
<td nowrap="nowrap" style="background-color:#000000;color:white">
000
000</td>
<td nowrap="nowrap" style="background-color:#FFCC00;color:black">
FFC
C00</td>
<td nowrap="nowrap" style="background-color:#FF9900;color:black">
FF9
900</td>
<td nowrap="nowrap" style="background-color:#FF6600;color:black">
FF6
600</td>
<td nowrap="nowrap" style="background-color:#FF3300;color:white">
FF3
300</td>
<td colspan="6"></td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#99CC00;color:black">
99C
C00</td>
<td colspan="4"></td>
<td nowrap="nowrap" style="background-color:#CC9900;color:black">
CC9
900</td>
<td nowrap="nowrap" style="background-color:#FFCC33;color:black">
FFC
C33</td>
<td nowrap="nowrap" style="background-color:#FFCC66;color:black">
FFC
C66</td>
<td nowrap="nowrap" style="background-color:#FF9966;color:black">
FF9
966</td>
<td nowrap="nowrap" style="background-color:#FF6633;color:black">
FF6
633</td>
<td nowrap="nowrap" style="background-color:#CC3300;color:white">
CC3
300</td>
<td colspan="4"></td>
<td nowrap="nowrap" style="background-color:#CC0033;color:white">
CC0
033</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#CCFF00;color:black">
CCF
F00</td>
<td nowrap="nowrap" style="background-color:#CCFF33;color:black">
CCF
F33</td>
<td nowrap="nowrap" style="background-color:#333300;color:white">
333
300</td>
<td nowrap="nowrap" style="background-color:#666600;color:white">
666
600</td>
<td nowrap="nowrap" style="background-color:#999900;color:black">
999
900</td>
<td nowrap="nowrap" style="background-color:#CCCC00;color:black">
CCC
C00</td>
<td nowrap="nowrap" style="background-color:#FFFF00;color:black">
FFF
F00</td>
<td nowrap="nowrap" style="background-color:#CC9933;color:black">
CC9
933</td>
<td nowrap="nowrap" style="background-color:#CC6633;color:white">
CC6
633</td>
<td nowrap="nowrap" style="background-color:#330000;color:white">
330
000</td>
<td nowrap="nowrap" style="background-color:#660000;color:white">
660
000</td>
<td nowrap="nowrap" style="background-color:#990000;color:white">
990
000</td>
<td nowrap="nowrap" style="background-color:#CC0000;color:white">
CC0
000</td>
<td nowrap="nowrap" style="background-color:#FF0000;color:white">
FF0
000</td>
<td nowrap="nowrap" style="background-color:#FF3366;color:white">
FF3
366</td>
<td nowrap="nowrap" style="background-color:#FF0033;color:white">
FF0
033</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#99FF00;color:black">
99F
F00</td>
<td nowrap="nowrap" style="background-color:#CCFF66;color:black">
CCF
F66</td>
<td nowrap="nowrap" style="background-color:#99CC33;color:black">
99C
C33</td>
<td nowrap="nowrap" style="background-color:#666633;color:white">
666
633</td>
<td nowrap="nowrap" style="background-color:#999933;color:black">
999
933</td>
<td nowrap="nowrap" style="background-color:#CCCC33;color:black">
CCC
C33</td>
<td nowrap="nowrap" style="background-color:#FFFF33;color:black">
FFF
F33</td>
<td nowrap="nowrap" style="background-color:#996600;color:white">
996
600</td>
<td nowrap="nowrap" style="background-color:#993300;color:white">
993
300</td>
<td nowrap="nowrap" style="background-color:#663333;color:white">
663
333</td>
<td nowrap="nowrap" style="background-color:#993333;color:white">
993
333</td>
<td nowrap="nowrap" style="background-color:#CC3333;color:white">
CC3
333</td>
<td nowrap="nowrap" style="background-color:#FF3333;color:white">
FF3
333</td>
<td nowrap="nowrap" style="background-color:#CC3366;color:white">
CC3
366</td>
<td nowrap="nowrap" style="background-color:#FF6699;color:black">
FF6
699</td>
<td nowrap="nowrap" style="background-color:#FF0066;color:white">
FF0
066</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#66FF00;color:black">
66F
F00</td>
<td nowrap="nowrap" style="background-color:#99FF66;color:black">
99F
F66</td>
<td nowrap="nowrap" style="background-color:#66CC33;color:black">
66C
C33</td>
<td nowrap="nowrap" style="background-color:#669900;color:white">
669
900</td>
<td nowrap="nowrap" style="background-color:#999966;color:black">
999
966</td>
<td nowrap="nowrap" style="background-color:#CCCC66;color:black">
CCC
C66</td>
<td nowrap="nowrap" style="background-color:#FFFF66;color:black">
FFF
F66</td>
<td nowrap="nowrap" style="background-color:#996633;color:white">
996
633</td>
<td nowrap="nowrap" style="background-color:#663300;color:white">
663
300</td>
<td nowrap="nowrap" style="background-color:#996666;color:white">
996
666</td>
<td nowrap="nowrap" style="background-color:#CC6666;color:black">
CC6
666</td>
<td nowrap="nowrap" style="background-color:#FF6666;color:black">
FF6
666</td>
<td nowrap="nowrap" style="background-color:#990033;color:white">
990
033</td>
<td nowrap="nowrap" style="background-color:#CC3399;color:white">
CC3
399</td>
<td nowrap="nowrap" style="background-color:#FF66CC;color:black">
FF6
6CC</td>
<td nowrap="nowrap" style="background-color:#FF0099;color:white">
FF0
099</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#33FF00;color:black">
33F
F00</td>
<td nowrap="nowrap" style="background-color:#66FF33;color:black">
66F
F33</td>
<td nowrap="nowrap" style="background-color:#339900;color:white">
339
900</td>
<td nowrap="nowrap" style="background-color:#66CC00;color:black">
66C
C00</td>
<td nowrap="nowrap" style="background-color:#99FF33;color:black">
99F
F33</td>
<td nowrap="nowrap" style="background-color:#CCCC99;color:black">
CCC
C99</td>
<td nowrap="nowrap" style="background-color:#FFFF99;color:black">
FFF
F99</td>
<td nowrap="nowrap" style="background-color:#CC9966;color:black">
CC9
966</td>
<td nowrap="nowrap" style="background-color:#CC6600;color:white">
CC6
600</td>
<td nowrap="nowrap" style="background-color:#CC9999;color:black">
CC9
999</td>
<td nowrap="nowrap" style="background-color:#FF9999;color:black">
FF9
999</td>
<td nowrap="nowrap" style="background-color:#FF3399;color:white">
FF3
399</td>
<td nowrap="nowrap" style="background-color:#CC0066;color:white">
CC0
066</td>
<td nowrap="nowrap" style="background-color:#990066;color:white">
990
066</td>
<td nowrap="nowrap" style="background-color:#FF33CC;color:black">
FF3
3CC</td>
<td nowrap="nowrap" style="background-color:#FF00CC;color:white">
FF0
0CC</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00CC00;color:white">
00C
C00</td>
<td nowrap="nowrap" style="background-color:#33CC00;color:black">
33C
C00</td>
<td nowrap="nowrap" style="background-color:#336600;color:white">
336
600</td>
<td nowrap="nowrap" style="background-color:#669933;color:white">
669
933</td>
<td nowrap="nowrap" style="background-color:#99CC66;color:black">
99C
C66</td>
<td nowrap="nowrap" style="background-color:#CCFF99;color:black">
CCF
F99</td>
<td nowrap="nowrap" style="background-color:#FFFFCC;color:black">
FFF
FCC</td>
<td nowrap="nowrap" style="background-color:#FFCC99;color:black">
FFC
C99</td>
<td nowrap="nowrap" style="background-color:#FF9933;color:black">
FF9
933</td>
<td nowrap="nowrap" style="background-color:#FFCCCC;color:black">
FFC
CCC</td>
<td nowrap="nowrap" style="background-color:#FF99CC;color:black">
FF9
9CC</td>
<td nowrap="nowrap" style="background-color:#CC6699;color:black">
CC6
699</td>
<td nowrap="nowrap" style="background-color:#993366;color:white">
993
366</td>
<td nowrap="nowrap" style="background-color:#660033;color:white">
660
033</td>
<td nowrap="nowrap" style="background-color:#CC0099;color:white">
CC0
099</td>
<td nowrap="nowrap" style="background-color:#330033;color:white">
330
033</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#33CC33;color:black">
33C
C33</td>
<td nowrap="nowrap" style="background-color:#66CC66;color:black">
66C
C66</td>
<td nowrap="nowrap" style="background-color:#00FF00;color:black">
00F
F00</td>
<td nowrap="nowrap" style="background-color:#33FF33;color:black">
33F
F33</td>
<td nowrap="nowrap" style="background-color:#66FF66;color:black">
66F
F66</td>
<td nowrap="nowrap" style="background-color:#99FF99;color:black">
99F
F99</td>
<td nowrap="nowrap" style="background-color:#CCFFCC;color:black">
CCF
FCC</td>
<td colspan="3"></td>
<td nowrap="nowrap" style="background-color:#CC99CC;color:black">
CC9
9CC</td>
<td nowrap="nowrap" style="background-color:#996699;color:white">
996
699</td>
<td nowrap="nowrap" style="background-color:#993399;color:white">
993
399</td>
<td nowrap="nowrap" style="background-color:#990099;color:white">
990
099</td>
<td nowrap="nowrap" style="background-color:#663366;color:white">
663
366</td>
<td nowrap="nowrap" style="background-color:#660066;color:white">
660
066</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#006600;color:white">
006
600</td>
<td nowrap="nowrap" style="background-color:#336633;color:white">
336
633</td>
<td nowrap="nowrap" style="background-color:#009900;color:white">
009
900</td>
<td nowrap="nowrap" style="background-color:#339933;color:white">
339
933</td>
<td nowrap="nowrap" style="background-color:#669966;color:black">
669
966</td>
<td nowrap="nowrap" style="background-color:#99CC99;color:black">
99C
C99</td>
<td colspan="3"></td>
<td nowrap="nowrap" style="background-color:#FFCCFF;color:black">
FFC
CFF</td>
<td nowrap="nowrap" style="background-color:#FF99FF;color:black">
FF9
9FF</td>
<td nowrap="nowrap" style="background-color:#FF66FF;color:black">
FF6
6FF</td>
<td nowrap="nowrap" style="background-color:#FF33FF;color:black">
FF3
3FF</td>
<td nowrap="nowrap" style="background-color:#FF00FF;color:white">
FF0
0FF</td>
<td nowrap="nowrap" style="background-color:#CC66CC;color:black">
CC6
6CC</td>
<td nowrap="nowrap" style="background-color:#CC33CC;color:white">
CC3
3CC</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#003300;color:white">
003
300</td>
<td nowrap="nowrap" style="background-color:#00CC33;color:white">
00C
C33</td>
<td nowrap="nowrap" style="background-color:#006633;color:white">
006
633</td>
<td nowrap="nowrap" style="background-color:#339966;color:white">
339
966</td>
<td nowrap="nowrap" style="background-color:#66CC99;color:black">
66C
C99</td>
<td nowrap="nowrap" style="background-color:#99FFCC;color:black">
99F
FCC</td>
<td nowrap="nowrap" style="background-color:#CCFFFF;color:black">
CCF
FFF</td>
<td nowrap="nowrap" style="background-color:#3399FF;color:black">
339
9FF</td>
<td nowrap="nowrap" style="background-color:#99CCFF;color:black">
99C
CFF</td>
<td nowrap="nowrap" style="background-color:#CCCCFF;color:black">
CCC
CFF</td>
<td nowrap="nowrap" style="background-color:#CC99FF;color:black">
CC9
9FF</td>
<td nowrap="nowrap" style="background-color:#9966CC;color:black">
996
6CC</td>
<td nowrap="nowrap" style="background-color:#663399;color:white">
663
399</td>
<td nowrap="nowrap" style="background-color:#330066;color:white">
330
066</td>
<td nowrap="nowrap" style="background-color:#9900CC;color:white">
990
0CC</td>
<td nowrap="nowrap" style="background-color:#CC00CC;color:white">
CC0
0CC</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00FF33;color:black">
00F
F33</td>
<td nowrap="nowrap" style="background-color:#33FF66;color:black">
33F
F66</td>
<td nowrap="nowrap" style="background-color:#009933;color:white">
009
933</td>
<td nowrap="nowrap" style="background-color:#00CC66;color:black">
00C
C66</td>
<td nowrap="nowrap" style="background-color:#33FF99;color:black">
33F
F99</td>
<td nowrap="nowrap" style="background-color:#99FFFF;color:black">
99F
FFF</td>
<td nowrap="nowrap" style="background-color:#99CCCC;color:black">
99C
CCC</td>
<td nowrap="nowrap" style="background-color:#0066CC;color:white">
006
6CC</td>
<td nowrap="nowrap" style="background-color:#6699CC;color:black">
669
9CC</td>
<td nowrap="nowrap" style="background-color:#9999FF;color:black">
999
9FF</td>
<td nowrap="nowrap" style="background-color:#9999CC;color:black">
999
9CC</td>
<td nowrap="nowrap" style="background-color:#9933FF;color:white">
993
3FF</td>
<td nowrap="nowrap" style="background-color:#6600CC;color:white">
660
0CC</td>
<td nowrap="nowrap" style="background-color:#660099;color:white">
660
099</td>
<td nowrap="nowrap" style="background-color:#CC33FF;color:white">
CC3
3FF</td>
<td nowrap="nowrap" style="background-color:#CC00FF;color:white">
CC0
0FF</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00FF66;color:black">
00F
F66</td>
<td nowrap="nowrap" style="background-color:#66FF99;color:black">
66F
F99</td>
<td nowrap="nowrap" style="background-color:#33CC66;color:black">
33C
C66</td>
<td nowrap="nowrap" style="background-color:#009966;color:white">
009
966</td>
<td nowrap="nowrap" style="background-color:#66FFFF;color:black">
66F
FFF</td>
<td nowrap="nowrap" style="background-color:#66CCCC;color:black">
66C
CCC</td>
<td nowrap="nowrap" style="background-color:#669999;color:black">
669
999</td>
<td nowrap="nowrap" style="background-color:#003366;color:white">
003
366</td>
<td nowrap="nowrap" style="background-color:#336699;color:white">
336
699</td>
<td nowrap="nowrap" style="background-color:#6666FF;color:white">
666
6FF</td>
<td nowrap="nowrap" style="background-color:#6666CC;color:white">
666
6CC</td>
<td nowrap="nowrap" style="background-color:#666699;color:white">
666
699</td>
<td nowrap="nowrap" style="background-color:#330099;color:white">
330
099</td>
<td nowrap="nowrap" style="background-color:#9933CC;color:white">
993
3CC</td>
<td nowrap="nowrap" style="background-color:#CC66FF;color:black">
CC6
6FF</td>
<td nowrap="nowrap" style="background-color:#9900FF;color:white">
990
0FF</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00FF99;color:black">
00F
F99</td>
<td nowrap="nowrap" style="background-color:#66FFCC;color:black">
66F
FCC</td>
<td nowrap="nowrap" style="background-color:#33CC99;color:black">
33C
C99</td>
<td nowrap="nowrap" style="background-color:#33FFFF;color:black">
33F
FFF</td>
<td nowrap="nowrap" style="background-color:#33CCCC;color:black">
33C
CCC</td>
<td nowrap="nowrap" style="background-color:#339999;color:white">
339
999</td>
<td nowrap="nowrap" style="background-color:#336666;color:white">
336
666</td>
<td nowrap="nowrap" style="background-color:#006699;color:white">
006
699</td>
<td nowrap="nowrap" style="background-color:#003399;color:white">
003
399</td>
<td nowrap="nowrap" style="background-color:#3333FF;color:white">
333
3FF</td>
<td nowrap="nowrap" style="background-color:#3333CC;color:white">
333
3CC</td>
<td nowrap="nowrap" style="background-color:#333399;color:white">
333
399</td>
<td nowrap="nowrap" style="background-color:#333366;color:white">
333
366</td>
<td nowrap="nowrap" style="background-color:#6633CC;color:white">
663
3CC</td>
<td nowrap="nowrap" style="background-color:#9966FF;color:black">
996
6FF</td>
<td nowrap="nowrap" style="background-color:#6600FF;color:white">
660
0FF</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00FFCC;color:black">
00FFCC</td>
<td nowrap="nowrap" style="background-color:#33FFCC;color:black">
33FFCC</td>
<td nowrap="nowrap" style="background-color:#00FFFF;color:black">
00FFFF</td>
<td nowrap="nowrap" style="background-color:#00CCCC;color:black">
00CCCC</td>
<td nowrap="nowrap" style="background-color:#009999;color:white">
009999</td>
<td nowrap="nowrap" style="background-color:#006666;color:white">
006666>/td>
<td nowrap="nowrap" style="background-color:#003333;color:white">
003333</td>
<td nowrap="nowrap" style="background-color:#3399CC;color:black">
3399CC</td>
<td nowrap="nowrap" style="background-color:#3366CC;color:white">
3366CC</td>
<td nowrap="nowrap" style="background-color:#0000FF;color:white">
0000FF</td>
<td nowrap="nowrap" style="background-color:#0000CC;color:white">
0000CC</td>
<td nowrap="nowrap" style="background-color:#000099;color:white">
000099</td>
<td nowrap="nowrap" style="background-color:#000066;color:white">
000066</td>
<td nowrap="nowrap" style="background-color:#000033;color:white">
000033</td>
<td nowrap="nowrap" style="background-color:#6633FF;color:white">
6633FF</td>
<td nowrap="nowrap" style="background-color:#3300FF;color:white">
3300FF</td>
</tr>

<tr>
<td nowrap="nowrap" style="background-color:#00CC99;color:black">
00CC99</td>
<td colspan="4"></td>
<td nowrap="nowrap" style="background-color:#0099CC;color:white">
0099CC</td>
<td nowrap="nowrap" style="background-color:#33CCFF;color:black">
33CCFF</td>
<td nowrap="nowrap" style="background-color:#66CCFF;color:black">
66CCFF</td>
<td nowrap="nowrap" style="background-color:#6699FF;color:black">
6699FF</td>
<td nowrap="nowrap" style="background-color:#3366FF;color:white">
3366FF</td>
<td nowrap="nowrap" style="background-color:#0033CC;color:white">
0033CC</td>
<td colspan="4"></td>
<td nowrap="nowrap" style="background-color:#3300CC;color:white">
3300CC</td>
</tr>

<tr>
<td colspan="6"></td>
<td nowrap="nowrap" style="background-color:#00CCFF;color:black">
00CCFF</td>
<td nowrap="nowrap" style="background-color:#0099FF;color:white">
0099FF</td>
<td nowrap="nowrap" style="background-color:#0066FF;color:white">
0066FF</td>
<td nowrap="nowrap" style="background-color:#0033FF;color:white">
0033FF</td>
<td colspan="6"></td>
</tr>
</table>


</body>
</html>





Similar Threads
Thread Thread Starter Forum Replies Last Post
Change background color using CSS pigtail Javascript How-To 9 April 4th, 2010 11:13 AM
CSS HELP:! CSS EXPANDIBLE BACKGROUND FOR TITLE phpuser2000 CSS Cascading Style Sheets 2 December 19th, 2007 12:36 AM
Rich's new CSS book: Beginning CSS 2nd Edition jminatel BOOK: Beginning CSS: Cascading Style Sheets for Web Design ISBN: 978-0-7645-7642-3 0 June 15th, 2007 11:55 AM
CSS Backgound / Color warnings socoolbrewster CSS Cascading Style Sheets 3 January 4th, 2007 08:15 AM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.