Jag kommer att blanda förklaringstext, kod och resultat på mina sidor.

För att föra det lättare att se vad som är vad har jag följande system:

Förklaringar visas som vanlig text

<div class="res">Programmens resultat visas på detta sätt</div>

<div class="code">Programmens kod visas på detta sätt.</div>

Asp kod visas på detta sätt

Ser du ingen skillnad stöder din browser inte CSS...

När jag nu en gång nämner färger...

Nedan kommer en lista över alla färger som stöds an Internet Explorer 4.0 (liten bonus)

<table border="1" cellpadding="0" cellspacing="0" bgcolor="#808080">
<tr>
<td align="center" style="background-color:aliceblue">ALICEBLUE 
(#F0F8FF)</td>
<td align="center" style="background-color:antiquewhite">ANTIQUEWHITE 
(#FAEBD7)</td>
<td align="center" style="background-color:aqua">AQUA 
(#00FFFF)</td>
<td align="center" style="background-color:aquamarine">AQUAMARINE 
(#7FFFD4)</td>
</tr>

<tr>
<td align="center" style="background-color:azure">AZURE 
(#F0FFFF)</td>
<td align="center" style="background-color:beige">BEIGE 
(#F5F5DC)</td>
<td align="center" style="background-color:bisque">BISQUE 
(#FFE4C4)</td>
<td align="center" style="background-color:black">BLACK 
(#000000)</td>
</tr>

<tr>
<td align="center" style="background-color:blanchedalmond">BLANCHEDALMOND 
(#FFEBCD)</td>
<td align="center" style="background-color:#0000FF">BLUE 
(#0000FF)</td>
<td align="center" style="background-color:#8A2BE2">BLUEVIOLET 
(#8A2BE2)</td>
<td align="center" style="background-color:brown">BROWN 
(#A52A2A)</td>
</tr>

<tr>
<td align="center" style="background-color:burlywood">BURLYWOOD 
(#DEB887)</td>
<td align="center" style="background-color:cadetblue">CADETBLUE 
(#5F9EA0)</td>
<td align="center" style="background-color:chartreuse">CHARTREUSE 
(#7FFF00)</td>
<td align="center" style="background-color:chocolate">CHOCOLATE 
(#D2691E)</td>
</tr>

<tr>
<td align="center" style="background-color:coral">CORAL 
(#FF7F50)</td>
<td align="center" style="background-color:#6495ED">CORNFLOWER 
(#6495ED)</td>
<td align="center" style="background-color:cornsilk">CORNSILK 
(#FFF8DC)</td>
<td align="center" style="background-color:crimson">CRIMSON 
(#DC143C)</td>
</tr>

<tr>
<td align="center" style="background-color:cyan">CYAN 
(#00FFFF)</td>
<td align="center" style="background-color:darkblue">DARKBLUE 
(#00008B)</td>
<td align="center" style="background-color:darkcyan">DARKCYAN 
(#008B8B)</td>
<td align="center" style="background-color:darkgoldenrod">DARKGOLDENROD 
(#B8860B)</td>
</tr>

<tr>
<td align="center" style="background-color:darkgray">DARKGRAY 
(#A9A9A9)</td>
<td align="center" style="background-color:darkgreen">DARKGREEN 
(#006400)</td>
<td align="center" style="background-color:darkkhaki">DARKKHAKI 
(#BDB76B)</td>
<td align="center" style="background-color:darkmagenta">DARKMAGENTA 
(#8B008B)</td>
</tr>

<tr>
<td align="center" style="background-color:darkolivegreen">DARKOLIVEGREEN 
(#556B2F)</td>
<td align="center" style="background-color:darkorange">DARKORANGE 
(#FF8C00)</td>
<td align="center" style="background-color:darkorchid">DARKORCHID 
(#9932CC)</td>
<td align="center" style="background-color:darkred">DARKRED 
(#8B0000)</td>
</tr>

<tr>
<td align="center" style="background-color:darksalmon">DARKSALMON 
(#E9967A)</td>
<td align="center" style="background-color:darkseagreen">DARKSEAGREEN 
(#8FBC8B)</td>
<td align="center" style="background-color:darkslateblue">DARKSLATEBLUE 
(#483D8B)</td>
<td align="center" style="background-color:darkslategray">DARKSLATEGRAY 
(#2F4F4F)</td>
</tr>

<tr>
<td align="center" style="background-color:darkturquoise">DARKTURQUOISE 
(#00CED1)</td>
<td align="center" style="background-color:darkviolet">DARKVIOLET 
(#9400D3)</td>
<td align="center" style="background-color:deeppink">DEEPPINK 
(#FF1493)</td>
<td align="center" style="background-color:deepskyblue">DEEPSKYBLUE 
(#00BFFF)</td>
</tr>

<tr>
<td align="center" style="background-color:dimgray">DIMGRAY 
(#696969)</td>
<td align="center" style="background-color:dodgerblue">DODGERBLUE 
(#1E90FF)</td>
<td align="center" style="background-color:firebrick">FIREBRICK 
(#B22222)</td>
<td align="center" style="background-color:floralwhite">FLORALWHITE 
(#FFFAF0)</td>
</tr>

<tr>
<td align="center" style="background-color:forestgreen">FORESTGREEN 
(#228B22)</td>
<td align="center" style="background-color:#FF00FF">FUCHIA 
(#FF00FF)</td>
<td align="center" style="background-color:gainsboro">GAINSBORO 
(#DCDCDC)</td>
<td align="center" style="background-color:ghostwhite">GHOSTWHITE 
(#F8F8FF)</td>
</tr>

<tr>
<td align="center" style="background-color:gold">GOLD 
(#FFD700)</td>
<td align="center" style="background-color:goldenrod">GOLDENROD 
(#DAA520)</td>
<td align="center" style="background-color:gray">GRAY 
(#808080)</td>
<td align="center" style="background-color:green">GREEN 
(#008000)</td>
</tr>

<tr>
<td align="center" style="background-color:greenyellow">GREENYELLOW 
(#ADFF2F)</td>
<td align="center" style="background-color:honeydew">HONEYDEW 
(#F0FFF0)</td>
<td align="center" style="background-color:hotpink">HOTPINK 
(#FF69B4)</td>
<td align="center" style="background-color:indianred">INDIANRED 
(#CD5C5C)</td>
</tr>

<tr>
<td align="center" style="background-color:indigo">INDIGO 
(#4B0082)</td>
<td align="center" style="background-color:ivory">IVORY 
(#FFFFF0)</td>
<td align="center" style="background-color:khaki">KHAKI 
(#F0E68C)</td>
<td align="center" style="background-color:lavender">LAVENDER 
(#E6E6FA)</td>
</tr>

<tr>
<td align="center" style="background-color:lavenderblush">LAVENDERBLUSH 
(#FFF0F5)</td>
<td align="center" style="background-color:lawngreen">LAWNGREEN 
(#7CFC00)</td>
<td align="center" style="background-color:lemonchiffon">LEMONCHIFFON 
(#FFFACD)</td>
<td align="center" style="background-color:lightblue">LIGHTBLUE 
(#ADD8E6)</td>
</tr>

<tr>
<td align="center" style="background-color:lightcoral">LIGHTCORAL 
(#F08080)</td>
<td align="center" style="background-color:lightcyan">LIGHTCYAN 
(#E0FFFF)</td>
<td align="center" style="background-color:lightgoldenrodyellow">LIGHTGOLDENRODYELLOW 
(#FAFAD2)</td>
<td align="center" style="background-color:lightgreen">LIGHTGREEN 
(#90EE90)</td>
</tr>

<tr>
<td align="center" style="background-color:lightgrey">LIGHTGREY 
(#D3D3D3)</td>
<td align="center" style="background-color:lightpink">LIGHTPINK 
(#FFB6C1)</td>
<td align="center" style="background-color:lightsalmon">LIGHTSALMON 
(#FFA07A)</td>
<td align="center" style="background-color:lightseagreen">LIGHTSEAGREEN 
(#20B2AA)</td>
</tr>

<tr>
<td align="center" style="background-color:lightskyblue">LIGHTSKYBLUE 
(#87CEFA)</td>
<td align="center" style="background-color:lightslategray">LIGHTSLATEGRAY 
(#778899)</td>
<td align="center" style="background-color:lightsteelblue">LIGHTSTEELBLUE 
(#B0C4DE)</td>
<td align="center" style="background-color:lightyellow">LIGHTYELLOW 
(#FFFFE0)</td>
</tr>

<tr>
<td align="center" style="background-color:lime">LIME 
(#00FF00)</td>
<td align="center" style="background-color:limegreen">LIMEGREEN 
(#32CD32)</td>
<td align="center" style="background-color:linen">LINEN 
(#FAF0E6)</td>
<td align="center" style="background-color:magenta">MAGENTA 
(#FF00FF)</td>
</tr>

<tr>
<td align="center" style="background-color:maroon">MAROON 
(#800000)</td>
<td align="center" style="background-color:mediumaquamarine">MEDIUMAQUAMARINE 
(#66CDAA)</td>
<td align="center" style="background-color:mediumblue">MEDIUMBLUE 
(#0000CD)</td>
<td align="center" style="background-color:mediumorchid">MEDIUMORCHID 
(#BA55D3)</td>
</tr>

<tr>
<td align="center" style="background-color:mediumpurple">MEDIUMPURPLE 
(#9370DB)</td>
<td align="center" style="background-color:mediumseagreen">MEDIUMSEAGREEN 
(#3CB371)</td>
<td align="center" style="background-color:mediumslateblue">MEDIUMSLATEBLUE 
(#7B68EE)</td>
<td align="center" style="background-color:mediumspringgreen">MEDIUMSPRINGGREEN 
(#00FA9A)</td>
</tr>

<tr>
<td align="center" style="background-color:mediumturquoise">MEDIUMTURQUOISE 
(#48D1CC)</td>
<td align="center" style="background-color:mediumvioletred">MEDIUMVIOLETRED 
(#C71585)</td>
<td align="center" style="background-color:midnightblue">MIDNIGHTBLUE 
(#191970)</td>
<td align="center" style="background-color:mintcream">MINTCREAM 
(#F5FFFA)</td>
</tr>

<tr>
<td align="center" style="background-color:mistyrose">MISTYROSE 
(#FFE4E1)</td>
<td align="center" style="background-color:moccasin">MOCCASIN 
(#FFE4B5)</td>
<td align="center" style="background-color:navajowhite">NAVAJOWHITE 
(#FFDEAD)</td>
<td align="center" style="background-color:navy">NAVY 
(#000080)</td>
</tr>

<tr>
<td align="center" style="background-color:oldlace">OLDLACE 
(#FDF5E6)</td>
<td align="center" style="background-color:olive">OLIVE 
(#808000)</td>
<td align="center" style="background-color:olivedrab">OLIVEDRAB 
(#6B8E23)</td>
<td align="center" style="background-color:orange">ORANGE 
(#FFA500)</td>
</tr>

<tr>
<td align="center" style="background-color:orangered">ORANGERED 
(#FF4500)</td>
<td align="center" style="background-color:orchid">ORCHID 
(#DA70D6)</td>
<td align="center" style="background-color:palegoldenrod">PALEGOLDENROD 
(#EEE8AA)</td>
<td align="center" style="background-color:palegreen">PALEGREEN 
(#98FB98)</td>
</tr>

<tr>
<td align="center" style="background-color:paleturquoise">PALETURQUOISE 
(#AFEEEE)</td>
<td align="center" style="background-color:palevioletred">PALEVIOLETRED 
(#DB7093)</td>
<td align="center" style="background-color:papayawhip">PAPAYAWHIP 
(#FFEFD5)</td>
<td align="center" style="background-color:peachpuff">PEACHPUFF 
(#FFDAB9)</td>
</tr>

<tr>
<td align="center" style="background-color:peru">PERU 
(#CD853F)</td>
<td align="center" style="background-color:pink">PINK 
(#FFC0CB)</td>
<td align="center" style="background-color:plum">PLUM 
(#DDA0DD)</td>
<td align="center" style="background-color:powderblue">POWDERBLUE 
(#B0E0E6)</td>
</tr>

<tr>
<td align="center" style="background-color:purple">PURPLE 
(#800080)</td>
<td align="center" style="background-color:red">RED 
(#FF0000)</td>
<td align="center" style="background-color:rosybrown">ROSYBROWN 
(#BC8F8F)</td>
<td align="center" style="background-color:royalblue">ROYALBLUE 
(#4169E1)</td>
</tr>

<tr>
<td align="center" style="background-color:saddlebrown">SADDLEBROWN 
(#8B4513)</td>
<td align="center" style="background-color:salmon">SALMON 
(#FA8072)</td>
<td align="center" style="background-color:sandybrown">SANDYBROWN 
(#F4A460)</td>
<td align="center" style="background-color:seagreen">SEAGREEN 
(#2E8B57)</td>
</tr>

<tr>
<td align="center" style="background-color:seashell">SEASHELL 
(#FFF5EE)</td>
<td align="center" style="background-color:sienna">SIENNA 
(#A0522D)</td>
<td align="center" style="background-color:silver">SILVER 
(#C0C0C0)</td>
<td align="center" style="background-color:skyblue">SKYBLUE 
(#87CEEB)</td>
</tr>

<tr>
<td align="center" style="background-color:slateblue">SLATEBLUE 
(#6A5ACD)</td>
<td align="center" style="background-color:slategray">SLATEGRAY 
(#708090)</td>
<td align="center" style="background-color:snow">SNOW 
(#FFFAFA)</td>
<td align="center" style="background-color:springgreen">SPRINGGREEN 
(#00FF7F)</td>
</tr>

<tr>
<td align="center" style="background-color:steelblue">STEELBLUE 
(#4682B4)</td>
<td align="center" style="background-color:tan">TAN 
(#D2B48C)</td>
<td align="center" style="background-color:teal">TEAL 
(#008080)</td>
<td align="center" style="background-color:thistle">THISTLE 
(#D8BFD8)</td>
</tr>

<tr>
<td align="center" style="background-color:tomato">TOMATO 
(#FF6347)</td>
<td align="center" style="background-color:turquoise">TURQUOISE 
(#40E0D0)</td>
<td align="center" style="background-color:violet">VIOLET 
(#EE82EE)</td>
<td align="center" style="background-color:wheat">WHEAT 
(#F5DEB3)</td>
</tr>

<tr>
<td align="center" style="background-color:white">WHITE 
(#FFFFFF)</td>
<td align="center" style="background-color:whitesmoke">WHITESMOKE 
(#F5F5F5)</td>
<td align="center" style="background-color:yellow">YELLOW 
(#FFFF00)</td>
<td align="center" style="background-color:yellowgreen">YELLOWGREEN 
(#9ACD32)</td>
</tr>
</table>

Ännu flera färger



<table border="1" cellpadding="3" cellspacing="0" bgcolor="#808080">
<tr>
<td align="center" style="background-color:activeborder">ACTIVEBORDER</td>
<td align="center" style="background-color:activecaption">ACTIVECAPTION</td>
<td align="center" style="background-color:appworkspace">APPWORKSPACE</td>
<td align="center" style="background-color:background">BACKGROUND</td>
</tr>

<tr>
<td align="center" style="background-color:buttonface">BUTTONFACE</td>
<td align="center" style="background-color:buttonhighlight">BUTTONHIGHLIGHT</td>
<td align="center" style="background-color:buttonshadow">BUTTONSHADOW</td>
<td align="center" style="background-color:buttontext">BUTTONTEXT</td>
</tr>

<tr>
<td align="center" style="background-color:captiontext">CAPTIONTEXT</td>
<td align="center" style="background-color:graytext">GRAYTEXT</td>
<td align="center" style="background-color:highlight">HIGHLIGHT</td>
<td align="center" style="background-color:highlighttext">HIGHLIGHTTEXT</td>
</tr>

<tr>
<td align="center" style="background-color:inactiveborder">INACTIVEBORDER</td>
<td align="center" style="background-color:inactivecaption">INACTIVECAPTION</td>
<td align="center" style="background-color:inactivecaptiontext">INACTIVECAPTIONTEXT</td>
<td align="center" style="background-color:infobackground">INFOBACKGROUND</td>
</tr>

<tr>
<td align="center" style="background-color:infotext">INFOTEXT</td>
<td align="center" style="background-color:menu">MENU</td>
<td align="center" style="background-color:menutext">MENUTEXT</td>
<td align="center" style="background-color:scrollbar">SCROLLBAR</td>
</tr>

<tr>
<td align="center" style="background-color:threeddarkshadow">THREEDDARKSHADOW</td>
<td align="center" style="background-color:threedface">THREEDFACE</td>
<td align="center" style="background-color:threedhighlight">THREEDHIGHLIGHT</td>
<td align="center" style="background-color:threedlightshadow">THREEDLIGHTSHADOW</td>
</tr>

<tr>
<td align="center" style="background-color:threedshadow">THREEDSHADOW</td>
<td align="center" style="background-color:window">WINDOW</td>
<td align="center" style="background-color:windowframe">WINDOWFRAME</td>
<td align="center" style="background-color:windowtext">WINDOWTEXT</td>
</tr>
</table>