به طور پیش فرض رنگ متون و جداول صفحه در تمام مرورگرها به رنگ مشکی می باشد . اما گاهی لازم داریم که رنگ یک سری از قسمت های متن را برای نمایش بهتر با یک رنگ متفاوت نمایش بدهیم . برای انجام اینکار می توانیم به صورت مستقیم رنگ قسمت مورد نظر را در Html تغییر بدهیم .
به صورت کلی رنگها با 2 مقدار در Html نشانه گذاری می شوند .
نوع اول استفاده از کد هگزا می باشد . اين کد تشکيل شده از 6 کاراکتر که هر کدام از آنها مي تواند يکي از مقادير زير باشد:
0,1,2,3,4,5,6,7,8,9, A,B,C,D,E,F
که اين شش کاراکتر بهمراه علامت # مي آيند، بدين شکل: FFFFFF# اين مقدار نمايانگر سه رنگ قرمز (Red) سبز (Green) و آبي (Blue) مي باشد که اصطلاحاً به آنها RGB مي گويند. اگر هگز يک رنگ را FF0099 در نظر بگيريم، FF مقدار ترکيبي رنگ قرمز، 00 مقدار ترکيبي رنگ سبز و 99 مقدار رنگ آبي را نشان مي دهد که 00 کمرنگ ترين و FF پر رنگ ترين حالت را نمايش مي دهند. بطور مثال FF0000 کاملاً رنگ قرمز را نشان مي دهد.
با ترکيب اين 16 کاراکتر مي توانيد 16.7 ميليون رنگ بسازيد. اما فقط 256 رنگ هست که سازگار با کليه سيستمهاي عامل و مرورگرها است يعني رنگهاي غير از آنها در سيستمهاي مختلف با هم فرق دارند
بنا بر اعلام W3C بهتر است براي بکارگيري رنگها از خصوصيات استايل شيت‌ها استفاده کنيد چون در آينده نزديک خصوصيات رنگها در عناصر کاربردي نخواهد داشت و از رده خارج مي‌شوند. همچنين از حروف بزرگ در مقداردهي رنگها استفاده کنيد و علامت # را فراموش نکنيد.
9 رنگ پر کاربرد را می توانید در زیر مشاهده کنید .
:: نام های استاندارد تعریف شده برای رنگ ها در CSS و HTML
برای تعداد ۱۴۷ رنگ در CSS و Html نام استاندارد تعریف شده که اونها رو با رنگ و کد معادلشون در زیر می بینید :
روش استفاده از کدهای فوق به شکل زیر می باشد
منبع: learning.asarayan.com
به صورت کلی رنگها با 2 مقدار در Html نشانه گذاری می شوند .
نوع اول استفاده از کد هگزا می باشد . اين کد تشکيل شده از 6 کاراکتر که هر کدام از آنها مي تواند يکي از مقادير زير باشد:
0,1,2,3,4,5,6,7,8,9, A,B,C,D,E,F
که اين شش کاراکتر بهمراه علامت # مي آيند، بدين شکل: FFFFFF# اين مقدار نمايانگر سه رنگ قرمز (Red) سبز (Green) و آبي (Blue) مي باشد که اصطلاحاً به آنها RGB مي گويند. اگر هگز يک رنگ را FF0099 در نظر بگيريم، FF مقدار ترکيبي رنگ قرمز، 00 مقدار ترکيبي رنگ سبز و 99 مقدار رنگ آبي را نشان مي دهد که 00 کمرنگ ترين و FF پر رنگ ترين حالت را نمايش مي دهند. بطور مثال FF0000 کاملاً رنگ قرمز را نشان مي دهد.
با ترکيب اين 16 کاراکتر مي توانيد 16.7 ميليون رنگ بسازيد. اما فقط 256 رنگ هست که سازگار با کليه سيستمهاي عامل و مرورگرها است يعني رنگهاي غير از آنها در سيستمهاي مختلف با هم فرق دارند
بنا بر اعلام W3C بهتر است براي بکارگيري رنگها از خصوصيات استايل شيت‌ها استفاده کنيد چون در آينده نزديک خصوصيات رنگها در عناصر کاربردي نخواهد داشت و از رده خارج مي‌شوند. همچنين از حروف بزرگ در مقداردهي رنگها استفاده کنيد و علامت # را فراموش نکنيد.
9 رنگ پر کاربرد را می توانید در زیر مشاهده کنید .
| رنگ | کد رنگ HEX | کد رنگ RGB |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #FF0000 | rgb(255,0,0) | |
| #00FF00 | rgb(0,255,0) | |
| #0000FF | rgb(0,0,255) | |
| #FFFF00 | rgb(255,255,0) | |
| #00FFFF | rgb(0,255,255) | |
| #FF00FF | rgb(255,0,255) | |
| #C0C0C0 | rgb(192,192,192) | |
| #FFFFFF | rgb(255,255,255) |
برای تعداد ۱۴۷ رنگ در CSS و Html نام استاندارد تعریف شده که اونها رو با رنگ و کد معادلشون در زیر می بینید :
| نام رنگ | HEX Code | رنگ |
|---|---|---|
| AliceBlue | #F0F8FF | |
| AntiqueWhite | #FAEBD7 | |
| Aqua | #00FFFF | |
| Aquamarine | #7FFFD4 | |
| Azure | #F0FFFF | |
| Beige | #F5F5DC | |
| Bisque | #FFE4C4 | |
| Black | #000000 | |
BlanchedAlmond | #FFEBCD | |
| Blue | #0000FF | |
| BlueViolet | #8A2BE2 | |
| Brown | #A52A2A | |
| BurlyWood | #DEB887 | |
| CadetBlue | #5F9EA0 | |
| Chartreuse | #7FFF00 | |
| Chocolate | #D2691E | |
| Coral | #FF7F50 | |
CornflowerBlue | #6495ED | |
| Cornsilk | #FFF8DC | |
| Crimson | #DC143C | |
| Cyan | #00FFFF | |
| DarkBlue | #00008B | |
| DarkCyan | #008B8B | |
DarkGoldenRod | #B8860B | |
| DarkGrey | #A9A9A9 | |
| DarkGreen | #006400 | |
| DarkKhaki | #BDB76B | |
| DarkMagenta | #8B008B | |
DarkOliveGreen | #556B2F | |
| Darkorange | #FF8C00 | |
| DarkOrchid | #9932CC | |
| DarkRed | #8B0000 | |
| DarkSalmon | #E9967A | |
| DarkSeaGreen | #8FBC8F | |
DarkSlateBlue | #483D8B | |
DarkSlateGrey | #2F4F4F | |
DarkTurquoise | #00CED1 | |
| DarkViolet | #9400D3 | |
| DeepPink | #FF1493 | |
| DeepSkyBlue | #00BFFF | |
| DimGrey | #696969 | |
| DodgerBlue | #1E90FF | |
| FireBrick | #B22222 | |
| FloralWhite | #FFFAF0 | |
| ForestGreen | #228B22 | |
| Fuchsia | #FF00FF | |
| Gainsboro | #DCDCDC | |
| GhostWhite | #F8F8FF | |
| Gold | #FFD700 | |
| GoldenRod | #DAA520 | |
| Grey | #808080 | |
| Green | #008000 | |
| GreenYellow | #ADFF2F | |
| HoneyDew | #F0FFF0 | |
| HotPink | #FF69B4 | |
| IndianRed | #CD5C5C | |
| Indigo | #4B0082 | |
| Ivory | #FFFFF0 | |
| Khaki | #F0E68C | |
| Lavender | #E6E6FA | |
LavenderBlush | #FFF0F5 | |
| LawnGreen | #7CFC00 | |
| LemonChiffon | #FFFACD | |
| LightBlue | #ADD8E6 | |
| LightCoral | #F08080 | |
| LightCyan | #E0FFFF | |
LightGoldenRodYellow | #FAFAD2 | |
| LightGrey | #D3D3D3 | |
| LightGreen | #90EE90 | |
| LightPink | #FFB6C1 | |
| LightSalmon | #FFA07A | |
LightSeaGreen | #20B2AA | |
| LightSkyBlue | #87CEFA | |
LightSlateGrey | #778899 | |
LightSteelBlue | #B0C4DE | |
| LightYellow | #FFFFE0 | |
| Lime | #00FF00 | |
| LimeGreen | #32CD32 | |
| Linen | #FAF0E6 | |
| Magenta | #FF00FF | |
| Maroon | #800000 | |
MediumAquaMarine | #66CDAA | |
| MediumBlue | #0000CD | |
| MediumOrchid | #BA55D3 | |
| MediumPurple | #9370D8 | |
MediumSeaGreen | #3CB371 | |
MediumSlateBlue | #7B68EE | |
MediumSpringGreen | #00FA9A | |
MediumTurquoise | #48D1CC | |
MediumVioletRed | #C71585 | |
| MidnightBlue | #191970 | |
| MintCream | #F5FFFA | |
| MistyRose | #FFE4E1 | |
| Moccasin | #FFE4B5 | |
| NavajoWhite | #FFDEAD | |
| Navy | #000080 | |
| OldLace | #FDF5E6 | |
| Olive | #808000 | |
| OliveDrab | #6B8E23 | |
| Orange | #FFA500 | |
| OrangeRed | #FF4500 | |
| Orchid | #DA70D6 | |
PaleGoldenRod | #EEE8AA | |
| PaleGreen | #98FB98 | |
PaleTurquoise | #AFEEEE | |
PaleVioletRed | #D87093 | |
| PapayaWhip | #FFEFD5 | |
| PeachPuff | #FFDAB9 | |
| Peru | #CD853F | |
| Pink | #FFC0CB | |
| Plum | #DDA0DD | |
| PowderBlue | #B0E0E6 | |
| Purple | #800080 | |
| Red | #FF0000 | |
| RosyBrown | #BC8F8F | |
| RoyalBlue | #4169E1 | |
| SaddleBrown | #8B4513 | |
| Salmon | #FA8072 | |
| SandyBrown | #F4A460 | |
| SeaGreen | #2E8B57 | |
| SeaShell | #FFF5EE | |
| Sienna | #A0522D | |
| Silver | #C0C0C0 | |
| SkyBlue | #87CEEB | |
| SlateBlue | #6A5ACD | |
| SlateGrey | #708090 | |
| Snow | #FFFAFA | |
| SpringGreen | #00FF7F | |
| SteelBlue | #4682B4 | |
| Tan | #D2B48C | |
| Teal | #008080 | |
| Thistle | #D8BFD8 | |
| Tomato | #FF6347 | |
| Turquoise | #40E0D0 | |
| Violet | #EE82EE | |
| Wheat | #F5DEB3 | |
| White | #FFFFFF | |
| WhiteSmoke | #F5F5F5 | |
| Yellow | #FFFF00 | |
| YellowGreen | #9ACD32 |
HTML:
<font color="red">رنگ متن به صورت قرمز در مرورگر نمایش داده می شود </font><font color="#038ffb" >رنگ متن به صورت آبی در مرورگر نمایش داده می شود </font>منبع: learning.asarayan.com