| <html><head><title>Color Test</title> |
| <style> |
| html { text-align: center; font-size: 10px; font-family: verdana; } |
| .content { |
| border: 1px solid black; |
| margin: 0 auto; |
| text-align: left; |
| width: 750px; |
| padding: 2px 2px 1px 2px; |
| } |
| .box { width: 100%; margin-bottom: 1px; } |
| .box:after { |
| content: " "; |
| display: block; |
| visibility: hidden; |
| clear: both; |
| height: 0.1px; |
| font-size: 0.1em; |
| line-height: 0; |
| } |
| * html .box { display: inline-block; } |
| * html .box { height: 1%; } |
| .box { display: block; } |
| |
| .inner { width: 620px; float: right; } |
| .text { float: left; } |
| </style> |
| </head><body> |
| |
| <div class="content"> |
| <div class="box"><div class="text">ActiveBorder</div><div class="inner" style="background-color: ActiveBorder"> </div></div> |
| <div class="box"><div class="text">ActiveCaption</div><div class="inner" style="background-color: ActiveCaption"> </div></div> |
| <div class="box"><div class="text">ActiveText</div><div class="inner" style="background-color: ActiveText"> </div></div> |
| <div class="box"><div class="text">AppWorkspace</div><div class="inner" style="background-color: AppWorkspace"> </div></div> |
| <div class="box"><div class="text">Background</div><div class="inner" style="background-color: Background"> </div></div> |
| <div class="box"><div class="text">ButtonFace</div><div class="inner" style="background-color: ButtonFace"> </div></div> |
| <div class="box"><div class="text">ButtonHighlight</div><div class="inner" style="background-color: ButtonHighlight"> </div></div> |
| <div class="box"><div class="text">ButtonShadow</div><div class="inner" style="background-color: ButtonShadow"> </div></div> |
| <div class="box"><div class="text">ButtonText</div><div class="inner" style="background-color: ButtonText"> </div></div> |
| <div class="box"><div class="text">CaptionText</div><div class="inner" style="background-color: CaptionText"> </div></div> |
| <div class="box"><div class="text">Canvas</div><div class="inner" style="background-color: Canvas"> </div></div> |
| <div class="box"><div class="text">CanvasText</div><div class="inner" style="background-color: CanvasText"> </div></div> |
| <div class="box"><div class="text">Field</div><div class="inner" style="background-color: Field"> </div></div> |
| <div class="box"><div class="text">FieldText</div><div class="inner" style="background-color: FieldText"> </div></div> |
| <div class="box"><div class="text">GrayText</div><div class="inner" style="background-color: GrayText"> </div></div> |
| <div class="box"><div class="text">Highlight</div><div class="inner" style="background-color: Highlight"> </div></div> |
| <div class="box"><div class="text">HighlightText</div><div class="inner" style="background-color: HighlightText"> </div></div> |
| <div class="box"><div class="text">InactiveBorder</div><div class="inner" style="background-color: InactiveBorder"> </div></div> |
| <div class="box"><div class="text">InactiveCaption</div><div class="inner" style="background-color: InactiveCaption"> </div></div> |
| <div class="box"><div class="text">InactiveCaptionText</div><div class="inner" style="background-color: InactiveCaptionText"> </div></div> |
| <div class="box"><div class="text">InfoBackground</div><div class="inner" style="background-color: InfoBackground"> </div></div> |
| <div class="box"><div class="text">InfoText</div><div class="inner" style="background-color: InfoText"> </div></div> |
| <div class="box"><div class="text">LinkText</div><div class="inner" style="background-color: LinkText"> </div></div> |
| <div class="box"><div class="text">Menu</div><div class="inner" style="background-color: Menu"> </div></div> |
| <div class="box"><div class="text">MenuText</div><div class="inner" style="background-color: MenuText"> </div></div> |
| <div class="box"><div class="text">Scrollbar</div><div class="inner" style="background-color: Scrollbar"> </div></div> |
| <div class="box"><div class="text">ThreeDDarkShadow</div><div class="inner" style="background-color: ThreeDDarkShadow"> </div></div> |
| <div class="box"><div class="text">ThreeDFace</div><div class="inner" style="background-color: ThreeDFace"> </div></div> |
| <div class="box"><div class="text">ThreeDHighlight</div><div class="inner" style="background-color: ThreeDHighlight"> </div></div> |
| <div class="box"><div class="text">ThreeDLightShadow</div><div class="inner" style="background-color: ThreeDLightShadow"> </div></div> |
| <div class="box"><div class="text">ThreeDShadow</div><div class="inner" style="background-color: ThreeDShadow"> </div></div> |
| <div class="box"><div class="text">VisitedText</div><div class="inner" style="background-color: VisitedText"> </div></div> |
| <div class="box"><div class="text">Window</div><div class="inner" style="background-color: Window"> </div></div> |
| <div class="box"><div class="text">WindowFrame</div><div class="inner" style="background-color: WindowFrame"> </div></div> |
| <div class="box"><div class="text">WindowText</div><div class="inner" style="background-color: WindowText"> </div></div> |
| </div> |
| </body></html> |
