HTML/CSS/CSS Attributes and Javascript Style Properties/color

Содержание

1 color:black
2 "color" Example
3 color: lime
4 color: rgb( 255)
5 Named colors

color:black

 
 
<html>
  <head>
    <style>
      p.center {text-align:center;color:black;}
    </style>
    <title>Chapter Two, XHTML and CSS</title>
  </head>
  <body>
    <p class="center">It is easy to use XHTML</p>
  </body>
</html>

"color" Example

    
<html>
<head>
<style>
.style1 { 
   font-family:verdana; 
   color:purple 
}
</style>
</head>
<body>
<p class="style1">A color text.</p>
</body>
</html>

color: lime

 


<html>
<head>
<title></title>
<style type="text/css">
h1 {font-family: arial;  color: navy;
    background-color: yellow;}
h1.red {font-family: "Times New Roman";
        color: red;
        background-color: black;}
h1.white {font-family: "Times New Roman";
          color: white;
          background-color: green}
h1.lime {font-family: arial;
         font-style: italic;
         color: lime;
         background-color: olive}
p.blackback {font-family: arial;
             font-style: italic;
             font-weight: bold;
             color: powderblue;
             background-color: black;}
p.yellowbk {background-color: yellow;
            font-size: 16pt}
p.red {font-weight: light;
       color: #ff0000;
       text-align: center;
       font-size: 32pt;}

</style>
</head>
<body>
<p><h1>basic headline.</h1></p>
<p><h1 class="red">red headline.</h1></p>
<p><h1 class="white">my white headline.</h1></p>
<p><h1 class="lime">my lime headline.</h1></p>
<p class="blackback">a sample of the blackback style.</p>
<p class="yellowbk">how yellowbk looks.</p>
<p class="red">red, centered font.</p>
<p>An unmodified paragraph.</p>

</body>
</html>

color: rgb( 255)

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title> </title>
        <style type="text/css" media="all">
            body {
                font-size: 12px;
            }
            h1 {
                font-size: 25px;
                background: rgb(255, 192, 203);
                padding: 25px;
                border: thin solid rgb(0, 0, 0);
            }
            p {
                font-size: 11px;
                padding: 11px;
                border: thin solid rgb(0, 0, 0);
                background: rgb(128, 128, 128);
                color: rgb(255, 255, 255);
            }
        </style>
    </head>
    <body>
        <h1>
            This is a heading
        </h1>
        <p>
            This is a paragraph of text.
        </p>
    </body>
</html>

Named colors

 
<HTML>
<HEAD>
  <TITLE>A Chart of the Named Colors</TITLE>
  <STYLE TYPE="text/css">
  td  {
       font-size:1.2em; font-weight:500;
  }
  table {
     Text-Align : Center
  }
  td.wt {
     Color : white ;
     Font-Weight : 500
  }
  </STYLE>
</HEAD>
<BODY BGCOLOR="black">
<P ALIGN="CENTER"><FONT SIZE="5" COLOR="silver">The Netscape Named Colors</FONT>
<DIV ALIGN="CENTER">
  <P>
  <TABLE BORDER="1" WIDTH="80%" cellpadding="5">
    <TR>
      <TD WIDTH="25%" BGCOLOR="aliceblue">aliceblue</TD>
      <TD WIDTH="25%" BGCOLOR="antiquewhite">antiquewhite</TD>
      <TD WIDTH="25%" BGCOLOR="aqua">aqua</TD>
      <TD WIDTH="25%" BGCOLOR="aquamarine">aquamarine</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="azure">azure</TD>
      <TD WIDTH="25%" BGCOLOR="beige">beige</TD>
      <TD WIDTH="25%" BGCOLOR="bisque">bisque</TD>
      <TD WIDTH="25%" BGCOLOR="blanchedalmond">blanchedalmond</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="blue" class="wt">blue</TD>
      <TD WIDTH="25%" BGCOLOR="blueviolet">blueviolet</TD>
      <TD WIDTH="25%" BGCOLOR="brown">brown</TD>
      <TD WIDTH="25%" BGCOLOR="burlywood">burlywood</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="cadetblue">cadetblue</TD>
      <TD WIDTH="25%" BGCOLOR="chartreuse">chartreuse</TD>
      <TD WIDTH="25%" BGCOLOR="chocolate">chocolate</TD>
      <TD WIDTH="25%" BGCOLOR="coral">coral</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="cornflowerblue">cornflowerblue</TD>
      <TD WIDTH="25%" BGCOLOR="cornsilk">cornsilk</TD>
      <TD WIDTH="25%" BGCOLOR="crimson">crimson</TD>
      <TD WIDTH="25%" BGCOLOR="aqua">cyan</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="darkblue" class="wt">darkblue</TD>
      <TD WIDTH="25%" BGCOLOR="darkcyan">darkcyan</TD>
      <TD WIDTH="25%" BGCOLOR="darkgoldenrod">darkgoldenrod</TD>
      <TD WIDTH="25%" BGCOLOR="darkgray">darkgray</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="darkgreen" class="wt">darkgreen</TD>
      <TD WIDTH="25%" BGCOLOR="darkkhaki">darkkhaki</TD>
      <TD WIDTH="25%" BGCOLOR="darkmagenta">darkmagenta</TD>
      <TD WIDTH="25%" BGCOLOR="darkolivegreen" class="wt">darkolivegreen</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="darkorange">darkorange</TD>
      <TD WIDTH="25%" BGCOLOR="darkorchid">darkorchid</TD>
      <TD WIDTH="25%" BGCOLOR="darkred">darkred</TD>
      <TD WIDTH="25%" BGCOLOR="darksalmon">darksalmon</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="darkseagreen">darkseagreen</TD>
      <TD WIDTH="25%" BGCOLOR="darkslateblue" class="wt">darkslateblue</TD>
      <TD WIDTH="25%" BGCOLOR="darkslategray" class="wt">darkslategray</TD>
      <TD WIDTH="25%" BGCOLOR="darkturquoise">darkturquoise</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="darkviolet">darkviolet</TD>
      <TD WIDTH="25%" BGCOLOR="deeppink">deeppink</TD>
      <TD WIDTH="25%" BGCOLOR="deepskyblue">deepskyblue</TD>
      <TD WIDTH="25%" BGCOLOR="dimgray" class="wt">dimgray</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="dodgerblue">dodgerblue</TD>
      <TD WIDTH="25%" BGCOLOR="firebrick">firebrick</TD>
      <TD WIDTH="25%" BGCOLOR="floralwhite">floralwhite</TD>
      <TD WIDTH="25%" BGCOLOR="forestgreen">forestgreen</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="fuchsia">fuchsia</TD>
      <TD WIDTH="25%" BGCOLOR="gainsboro">gainsboro</TD>
      <TD WIDTH="25%" BGCOLOR="ghostwhite">ghostwhite</TD>
      <TD WIDTH="25%" BGCOLOR="gold">gold</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="goldenrod">goldenrod</TD>
      <TD WIDTH="25%" BGCOLOR="gray">gray</TD>
      <TD WIDTH="25%" BGCOLOR="green">green</TD>
      <TD WIDTH="25%" BGCOLOR="greenyellow">greenyellow</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="honeydew">honeydew</TD>
      <TD WIDTH="25%" BGCOLOR="hotpink">hotpink</TD>
      <TD WIDTH="25%" BGCOLOR="indianred">indianred</TD>
      <TD WIDTH="25%" BGCOLOR="indigo" class="wt">indigo</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="ivory">ivory</TD>
      <TD WIDTH="25%" BGCOLOR="khaki">khaki</TD>
      <TD WIDTH="25%" BGCOLOR="lavender">lavender</TD>
      <TD WIDTH="25%" BGCOLOR="lavenderblush">lavenderblush</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="lawngreen">lawngreen</TD>
      <TD WIDTH="25%" BGCOLOR="lemonchiffon">lemonchiffon</TD>
      <TD WIDTH="25%" BGCOLOR="lightblue">lightblue</TD>
      <TD WIDTH="25%" BGCOLOR="lightcoral">lightcoral</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="lightcyan">lightcyan</TD>
      <TD WIDTH="25%" BGCOLOR="lightgoldenrodyellow">lightgoldenrodyellow</TD>
      <TD WIDTH="25%" BGCOLOR="lightgreen">lightgreen</TD>
      <TD WIDTH="25%" BGCOLOR="lightgrey">lightgrey</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="lightpink">lightpink</TD>
      <TD WIDTH="25%" BGCOLOR="lightsalmon">lightsalmon</TD>
      <TD WIDTH="25%" BGCOLOR="lightseagreen">lightseagreen</TD>
      <TD WIDTH="25%" BGCOLOR="lightskyblue">lightskyblue</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="lightslategray">lightslategray</TD>
      <TD WIDTH="25%" BGCOLOR="lightsteelblue">lightsteelblue</TD>
      <TD WIDTH="25%" BGCOLOR="lightyellow">lightyellow</TD>
      <TD WIDTH="25%" BGCOLOR="lime">lime</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="limegreen">limegreen</TD>
      <TD WIDTH="25%" BGCOLOR="linen">linen</TD>
      <TD WIDTH="25%" BGCOLOR="fuchsia">magenta</TD>
      <TD WIDTH="25%" BGCOLOR="maroon" class="wt">maroon</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="mediumaquamarine">mediaumaquamarine</TD>
      <TD WIDTH="25%" BGCOLOR="mediumblue" class="wt">mediumblue</TD>
      <TD WIDTH="25%" BGCOLOR="mediumorchid">mediumorchid</TD>
      <TD WIDTH="25%" BGCOLOR="mediumpurple">mediumpurple</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="mediumseagreen">mediumseagreen</TD>
      <TD WIDTH="25%" BGCOLOR="mediumslateblue">mediumslateblue</TD>
      <TD WIDTH="25%" BGCOLOR="mediumvioletred">mediumvioletred</TD>
      <TD WIDTH="25%" BGCOLOR="midnightblue" class="wt">midnightblue</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="mintcream">mintcream</TD>
      <TD WIDTH="25%" BGCOLOR="mistyrose">mistyrose</TD>
      <TD WIDTH="25%" BGCOLOR="moccasin">moccasin</TD>
      <TD WIDTH="25%" BGCOLOR="navajowhite">navajowhite</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="navy" class="wt">navy</TD>
      <TD WIDTH="25%" BGCOLOR="oldlace">oldlace</TD>
      <TD WIDTH="25%" BGCOLOR="olive">olive</TD>
      <TD WIDTH="25%" BGCOLOR="olivedrab">olivedrab</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="orange">orange</TD>
      <TD WIDTH="25%" BGCOLOR="orangered">orangered</TD>
      <TD WIDTH="25%" BGCOLOR="orchid">orchid</TD>
      <TD WIDTH="25%" BGCOLOR="palegoldenrod">palegoldenrod</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="palegreen">palegreen</TD>
      <TD WIDTH="25%" BGCOLOR="paleturquoise">paleturquoise</TD>
      <TD WIDTH="25%" BGCOLOR="palevioletred">palevioletred</TD>
      <TD WIDTH="25%" BGCOLOR="papayawhip">papayawhip</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="peachpuff">peachpuff</TD>
      <TD WIDTH="25%" BGCOLOR="peru">peru</TD>
      <TD WIDTH="25%" BGCOLOR="pink">pink</TD>
      <TD WIDTH="25%" BGCOLOR="plum">plum</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="powderblue">powderblue</TD>
      <TD WIDTH="25%" BGCOLOR="red">red</TD>
      <TD WIDTH="25%" BGCOLOR="rosybrown">rosybrown</TD>
      <TD WIDTH="25%" BGCOLOR="royalblue">royalblue</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="saddlebrown">saddlebrown</TD>
      <TD WIDTH="25%" BGCOLOR="salmon">salmon</TD>
      <TD WIDTH="25%" BGCOLOR="sandybrown">sandybrown</TD>
      <TD WIDTH="25%" BGCOLOR="seagreen">seagreen</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="seashell">seashell</TD>
      <TD WIDTH="25%" BGCOLOR="sienna">sienna</TD>
      <TD WIDTH="25%" BGCOLOR="silver">sliver</TD>
      <TD WIDTH="25%" BGCOLOR="skyblue">skyblue</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="slateblue">slateblue</TD>
      <TD WIDTH="25%" BGCOLOR="slategray">slategray</TD>
      <TD WIDTH="25%" BGCOLOR="snow">snow</TD>
      <TD WIDTH="25%" BGCOLOR="springgreen">springgreen</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="steelblue">steelblue</TD>
      <TD WIDTH="25%" BGCOLOR="tan">tan</TD>
      <TD WIDTH="25%" BGCOLOR="teal">teal</TD>
      <TD WIDTH="25%" BGCOLOR="thistle">thistle</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="tomato">tomato</TD>
      <TD WIDTH="25%" BGCOLOR="turquoise">turquoise</TD>
      <TD WIDTH="25%" BGCOLOR="violet">violet</TD>
      <TD WIDTH="25%" BGCOLOR="wheat">wheat</TD>
    </TR>
    <TR>
      <TD WIDTH="25%" BGCOLOR="white">white</TD>
      <TD WIDTH="25%" BGCOLOR="whitesmoke">whitesmoke</TD>
      <TD WIDTH="25%" BGCOLOR="yellow">yellow</TD>
      <TD WIDTH="25%" BGCOLOR="yellowgreen">yellowgreen</TD>
    </TR>
  </TABLE>
</DIV>

</BODY>
</HTML>

HTML/CSS/CSS Attributes and Javascript Style Properties/color

Содержание

color:black

"color" Example

color: lime

color: rgb( 255)

Named colors

Навигация

Персональные инструменты

Пространства имён

Варианты

Просмотры

Ещё

Поиск

Разделы

Навигация

Инструменты