说明

让我们看看 HTML 的三种简单颜色。

通常，颜色组合显示为红色、绿色和蓝色。

CSS 颜色是使用十六进制 (hex) 表示法指定的红色、绿色和蓝色颜色值 (RGB) 的组合。
可以提供给光源之一的最小值是 0（十六进制 00）。
最高值为 255（十六进制 FF）。

十六进制值写为 6 位数字，以 # 符号开头。

下面我们将看到网页颜色的十六进制值，我们甚至可以用小写字母书写。
一样的。

例如白色是#FFFFFF 或者#ffffff。

在本章中，我们将讨论颜色。

现代浏览器支持以下所有 140 种颜色名称：

<table class="table table-bordered"> <thead> <tr> <th style="text-align:center" class="col-md-4">颜色名称</th> <th style="text-align:center" class="col-md-4">颜色</th> <th style="text-align:center" class="col-md-4">16进制值</th> <thead> </thead><tbody> <tr> <td>AliceBlue</td> <td style="background:#F0F8FF"></td> <td>#F0F8FF</td> </tr> <tr> <td>AntiqueWhite </td> <td style="background:#FAEBD7"></td> <td>#FAEBD7</td> </tr> <tr> <td>Aqua</td> <td style="background:#00FFFF"></td> <td>#00FFFF</td> </tr> <tr> <td>Aquamarine </td> <td style="background:#7FFFD4"></td> <td>#7FFFD4</td> </tr> <tr> <td>Azure </td> <td style="background:#F0FFFF"></td> <td>#F0FFFF</td> </tr> <tr> <td>Beige </td> <td style="background:#F5F5DC"></td> <td>#F5F5DC</td> </tr> <tr> <td>Bisque</td> <td style="background:#FFE4C4"></td> <td>#FFE4C4</td> </tr> <tr> <td>Black</td> <td style="background:#000000"></td> <td>#000000</td> </tr> <tr> <td>BlanchedAlmond </td> <td style="background:#FFEBCD"></td> <td>#FFEBCD</td> </tr> <tr> <td>Blue</td> <td style="background:#0000FF"></td> <td>#0000FF</td> </tr> <tr> <td>BlueViolet </td> <td style="background:#8A2BE2"></td> <td>#8A2BE2</td> </tr> <tr> <td>Brown</td> <td style="background:#A52A2A"></td> <td>#A52A2A</td> </tr> <tr> <td>BurlyWood </td> <td style="background:#DEB887"></td> <td>#DEB887</td> </tr> <tr> <td>CadetBlue </td> <td style="background:#5F9EA0"></td> <td>#5F9EA0</td> </tr> <tr> <td>Chocolate </td> <td style="background:#D2691E"></td> <td>#D2691E</td> </tr> <tr> <td>Coral </td> <td style="background:#FF7F50"></td> <td>#FF7F50</td> </tr> <tr> <td>CornflowerBlue </td> <td style="background:#6495ED"></td> <td>#6495ED</td> </tr> <tr> <td>Cornsilk </td> <td style="background:#FFF8DC"></td> <td>#FFF8DC</td> </tr> <tr> <td>Crimson </td> <td style="background:#DC143C"></td> <td>#DC143C</td> </tr> <tr> <td>Cyan </td> <td style="background:#00FFFF"></td> <td>#00FFFF</td> </tr> <tr> <td>DarkBlue </td> <td style="background:#00008B"></td> <td>#00008B</td> </tr> <tr> <td>DarkCyan </td> <td style="background:#008B8B"></td> <td>#008B8B</td> </tr> <tr> <td>DarkGoldenRod </td> <td style="background:#B8860B"></td> <td>#B8860B</td> </tr> <tr> <td>DarkGray </td> <td style="background:#A9A9A9"></td> <td>#A9A9A9</td> </tr> <tr> <td>DarkGreen </td> <td style="background:#006400"></td> <td>#006400</td> </tr> <tr> <td>DarkKhaki </td> <td style="background:#BDB76B"></td> <td>#BDB76B</td> </tr> <tr> <td>DarkMagenta </td> <td style="background:#8B008B"></td> <td>#8B008B</td> </tr> <tr> <td>DarkOliveGreen </td> <td style="background:#556B2F"></td> <td>#556B2F</td> </tr> <tr> <td>DarkOrange </td> <td style="background:#FF8C00"></td> <td>#FF8C00</td> </tr> <tr> <td>DarkOrchid </td> <td style="background:#9932CC"></td> <td>#9932CC</td> </tr> <tr> <td>DarkRed </td> <td style="background:#8B0000"></td> <td>#8B0000</td> </tr> <tr> <td>DarkSalmon </td> <td style="background:#E9967A"></td> <td>#E9967A</td> </tr> <tr> <td>DarkSeaGreen </td> <td style="background:#8FBC8F"></td> <td>#8FBC8F</td> </tr> <tr> <td>DarkSlateBlue </td> <td style="background:#483D8B"></td> <td>#483D8B</td> </tr> <tr> <td>DarkSlateGray </td> <td style="background:#2F4F4F"></td> <td>#2F4F4F</td> </tr> <tr> <td>DarkTurquoise </td> <td style="background:#00CED1"></td> <td>#00CED1</td> </tr> <tr> <td>DarkViolet </td> <td style="background:#9400D3"></td> <td>#9400D3</td> </tr> <tr> <td>DeepPink </td> <td style="background:#FF1493"></td> <td>#FF1493</td> </tr> <tr> <td>DeepSkyBlue </td> <td style="background:#00BFFF"></td> <td>#00BFFF</td> </tr> <tr> <td>DimGray </td> <td style="background:#696969"></td> <td>#696969</td> </tr> <tr> <td>DodgerBlue </td> <td style="background:#1E90FF"></td> <td>#1E90FF</td> </tr> <tr> <td>FireBrick </td> <td style="background:#B22222"></td> <td>#B22222</td> </tr> <tr> <td>FloralWhite </td> <td style="background:#FFFAF0"></td> <td>#FFFAF0</td> </tr> <tr> <td>ForestGreen </td> <td style="background:#228B22"></td> <td>#228B22</td> </tr> <tr> <td>Fuchsia </td> <td style="background:#FF00FF"></td> <td>#FF00FF</td> </tr> <tr> <td>Gainsboro </td> <td style="background:DCDCDC"></td> <td>DCDCDC</td> </tr> <tr> <td>GhostWhite </td> <td style="background:#F8F8FF"></td> <td>#F8F8FF</td> </tr> <tr> <td>Gold </td> <td style="background:#FFD700"></td> <td>#FFD700</td> </tr> <tr> <td>GoldenRod </td> <td style="background:#DAA520"></td> <td>#DAA520</td> </tr> <tr> <td>Gray </td> <td style="background:#808080"></td> <td>#808080</td> </tr> <tr> <td>Green </td> <td style="background:#008000"></td> <td>#008000</td> </tr> <tr> <td>GreenYellow </td> <td style="background:#ADFF2F"></td> <td>#ADFF2F</td> </tr> <tr> <td> HoneyDew </td> <td style="background:#F0FFF0"></td> <td>#F0FFF0</td> </tr> <tr> <td>HotPink </td> <td style="background:#FF69B4"></td> <td>#FF69B4</td> </tr> <tr> <td>NetherlandsnRed </td> <td style="background:#CD5C5C"></td> <td>#CD5C5C</td> </tr> <tr> <td>Indigo</td> <td style="background:#4B0082"></td> <td>#4B0082</td> </tr> <tr> <td>Ivory</td> <td style="background:#FFFFF0"></td> <td>#FFFFF0</td> </tr> <tr> <td>Khaki</td> <td style="background:#F0E68C"></td> <td>#F0E68C</td> </tr> <tr> <td> Lavender</td> <td style="background:#E6E6FA"></td> <td>#E6E6FA</td> </tr> <tr> <td>LavenderBlush</td> <td style="background:#FFF0F5"></td> <td>#FFF0F5</td> </tr> <tr> <td>LawnGreen</td> <td style="background:#7CFC00"></td> <td>#7CFC00</td> </tr> <tr> <td>LemonChiffon </td> <td style="background:#FFFACD"></td> <td>#FFFACD</td> </tr> <tr> <td>LightBlue</td> <td style="background:#ADD8E6"></td> <td>#ADD8E6</td> </tr> <tr> <td>LightCoral </td> <td style="background:#F08080"></td> <td>#F08080</td> </tr> <tr> <td>LightCyan </td> <td style="background:#E0FFFF"></td> <td>#E0FFFF</td> </tr> <tr> <td>LightGoldenRodYellow</td> <td bgcolor="#FAFAD2"></td> <td>#FAFAD2</td> </tr> <tr> <td>LightGray</td> <td bgcolor="#D3D3D3"></td> <td>#D3D3D3</td> </tr> <tr> <td>LightGreen</td> <td bgcolor="#90EE90"></td> <td>#90EE90</td> </tr> <tr> <td>LightPink</td> <td bgcolor="#FFB6C1"></td> <td>#FFB6C1</td> </tr> <tr> <td>LightSalmon</td> <td bgcolor="#FFA07A"></td> <td>#FFA07A</td> </tr> <tr> <td>LightSeaGreen</td> <td bgcolor="#20B2AA"></td> <td>#20B2AA</td> </tr> <tr> <td>LightSkyBlue</td> <td bgcolor="#87CEFA"></td> <td>#87CEFA</td> </tr> <tr> <td>LightSlateGray</td> <td bgcolor="#778899"></td> <td>#778899</td> </tr> <tr> <td>LightSteelBlue</td> <td bgcolor="#B0C4DE"></td> <td>#B0C4DE</td> </tr> <tr> <td>LightYellow</td> <td bgcolor="#FFFFE0"></td> <td>#FFFFE0</td> </tr> <tr> <td>Lime</td> <td bgcolor="#00FF00"></td> <td>#00FF00</td> </tr> <tr> <td>LimeGreen</td> <td bgcolor="#32CD32"></td> <td>#32CD32</td> </tr> <tr> <td>Linen</td> <td bgcolor="#FAF0E6"></td> <td>#FAF0E6</td> </tr> <tr> <td>Magenta</td> <td bgcolor="#FF00FF"></td> <td>#FF00FF</td> </tr> <tr> <td>Maroon</td> <td bgcolor="#800000"></td> <td>#800000</td> </tr> <tr> <td>MediumAquaMarine</td> <td bgcolor="#66CDAA"></td> <td>#66CDAA</td> </tr> <tr> <td>MediumBlue</td> <td bgcolor="#0000CD"></td> <td>#0000CD</td> </tr> <tr> <td>MediumOrchid</td> <td bgcolor="#BA55D3"></td> <td>#BA55D3</td> </tr> <tr> <td>MediumPurple</td> <td bgcolor="#9370DB"></td> <td>#9370DB</td> </tr> <tr> <td>MediumSeaGreen</td> <td bgcolor="#3CB371"></td> <td>#3CB371</td> </tr> <tr> <td>MediumSlateBlue</td> <td bgcolor="#7B68EE"></td> <td>#7B68EE</td> </tr> <tr> <td>MediumSpringGreen</td> <td bgcolor="#00FA9A"></td> <td>#00FA9A</td> </tr> <tr> <td>MediumTurquoise</td> <td bgcolor="#48D1CC"></td> <td>#48D1CC</td> </tr> <tr> <td>MediumVioletRed</td> <td bgcolor="#C71585"></td> <td>#C71585</td> </tr> <tr> <td>MidnightBlue</td> <td bgcolor="#191970"> </td> <td>#191970</td> </tr> <tr> <td>MintCream</td> <td bgcolor="#F5FFFA"> </td> <td>#F5FFFA</td> </tr> <tr> <td>MistyRose</td> <td bgcolor="#FFE4E1"> </td> <td>#FFE4E1</td> </tr> <tr> <td>Moccasin</td> <td bgcolor="#FFE4B5"> </td> <td>#FFE4B5</td> </tr> <tr> <td>NavajoWhite</td> <td bgcolor="#FFDEAD"> </td> <td>#FFDEAD</td> </tr> <tr> <td>Navy</td> <td bgcolor="#000080"> </td> <td>#000080</td> </tr> <tr> <td>OldLace</td> <td bgcolor="#FDF5E6"> </td> <td>#FDF5E6</td> </tr> <tr> <td>Olive</td> <td bgcolor="#808000"> </td> <td>#808000</td> </tr> <tr> <td>OliveDrab</td> <td bgcolor="#6B8E23"> </td> <td>#6B8E23</td> </tr> <tr> <td>Orange</td> <td bgcolor="#FFA500"> </td> <td>#FFA500</td> </tr> <tr> <td>OrangeRed</td> <td bgcolor="#FF4500"> </td> <td>#FF4500</td> </tr> <tr> <td>Orchid</td> <td bgcolor="#DA70D6"> </td> <td>#DA70D6</td> </tr> <tr> <td>PaleGoldenRod</td> <td bgcolor="#EEE8AA"> </td> <td>#EEE8AA</td> </tr> <tr> <td>PaleGreen</td> <td bgcolor="#98FB98"> </td> <td>#98FB98</td> </tr> <tr> <td>PaleTurquoise</td> <td bgcolor="#AFEEEE"> </td> <td>#AFEEEE</td> </tr> <tr> <td>PaleVioletRed</td> <td bgcolor="#DB7093"> </td> <td>#DB7093</td> </tr> <tr> <td>PapayaWhip</td> <td bgcolor="#FFEFD5"> </td> <td>#FFEFD5</td> </tr> <tr> <td>PeachPuff</td> <td bgcolor="#FFDAB9"> </td> <td>#FFDAB9</td> </tr> <tr> <td>Peru</td> <td bgcolor="#CD853F"> </td> <td>#CD853F</td> </tr> <tr> <td>Pink</td> <td bgcolor="#FFC0CB"> </td> <td>#FFC0CB</td> </tr> <tr> <td>Plum</td> <td bgcolor="#DDA0DD"> </td> <td>#DDA0DD</td> </tr> <tr> <td>PowderBlue</td> <td bgcolor="#B0E0E6"> </td> <td>#B0E0E6</td> </tr> <tr> <td>Purple</td> <td bgcolor="#800080"> </td> <td>#800080</td> </tr> <tr> <td>Red</td> <td bgcolor="#FF0000"> </td> <td>#FF0000</td> </tr> <tr> <td>RosyBrown</td> <td bgcolor="#BC8F8F"> </td> <td>#BC8F8F</td> </tr> <tr> <td>RoyalBlue</td> <td bgcolor="#4169E1"> </td> <td>#4169E1</td> </tr> <tr> <td>SaddleBrown</td> <td bgcolor="#8B4513"> </td> <td>#8B4513</td> </tr> <tr> <td>Salmon</td> <td bgcolor="#FA8072"> </td> <td>#FA8072</td> </tr> <tr> <td>SandyBrown</td> <td bgcolor="#F4A460"> </td> <td>#F4A460</td> </tr> <tr> <td>SeaGreen</td> <td bgcolor="#2E8B57"> </td> <td>#2E8B57</td> </tr> <tr> <td>SeaShell</td> <td bgcolor="#FFF5EE"> </td> <td>#FFF5EE</td> </tr> <tr> <td>Sienna</td> <td bgcolor="#A0522D"> </td> <td>#A0522D</td> </tr> <tr> <td>Silver</td> <td bgcolor="#C0C0C0"> </td> <td>#C0C0C0</td> </tr> <tr> <td>SkyBlue</td> <td bgcolor="#87CEEB"> </td> <td>#87CEEB</td> </tr> <tr> <td>SlateBlue</td> <td bgcolor="#6A5ACD"> </td> <td>#6A5ACD</td> </tr> <tr> <td>SlateGray</td> <td bgcolor="#708090"> </td> <td>#708090</td> </tr> <tr> <td>Snow</td> <td bgcolor="#FFFAFA"> </td> <td>#FFFAFA</td> </tr> <tr> <td>SpringGreen</td> <td bgcolor="#00FF7F"> </td> <td>#00FF7F</td> </tr> <tr> <td>SteelBlue</td> <td bgcolor="#4682B4"> </td> <td>#4682B4</td> </tr> <tr> <td>Tan</td> <td bgcolor="#D2B48C"> </td> <td>#D2B48C</td> </tr> <tr> <td>Teal</td> <td bgcolor="#008080"> </td> <td>#008080</td> </tr> <tr> <td>Thistle</td> <td bgcolor="#D8BFD8"></td> <td>#D8BFD8</td> </tr> <tr> <td>Tomato</td> <td bgcolor="#FF6347"></td> <td>#FF6347</td> </tr> <tr> <td>Turquoise</td> <td bgcolor="#40E0D0"></td> <td>#40E0D0</td> </tr> <tr> <td>Violet</td> <td bgcolor="#EE82EE"></td> <td>#EE82EE</td> </tr> <tr> <td>Wheat</td> <td bgcolor="#F5DEB3"></td> <td>#F5DEB3</td> </tr> <tr> <td>White</td> <td bgcolor="#FFFFFF"></td> <td>#FFFFFF</td> </tr> <tr> <td>WhiteSmoke</td> <td bgcolor="#F5F5F5"></td> <td>#F5F5F5</td> </tr> <tr> <td>Yellow</td> <td bgcolor="#FFFF00"></td> <td>#FFFF00</td> </tr> <tr> <td>YellowGreen</td> <td bgcolor="#9ACD32"></td> <td>#9ACD32</td> </tr> </tbody> </tr></thead></table>