سون ریپلای

  • هیچ محصولی در سبد خرید نیست.

آموزش کار با رنگ ها یا Colors در HTML

مطالب وبلاگ سایت, آموزش html
بدون دیدگاه

  • سلام و دورود میکنم خدمت تمام دوستان و همراهان همیشگی وب سایت سون ریپلای در جلسه از آموزش html css میخواهیم آموزش کار با رنگ ها یا Colors در HTML خدمت شما عزیزان آموزش بدیم پس تا آخر باما همراه باشید .

    در طراحی صفحات html در موارد زیادی همچون تعیین رنگ پس زمینه ، رنگ فونت های متن و …
    می توانیم از رنگ های مختلف استفاده کنیم . برای تعیین یک رنگ مشخص در html ،
    سه روش وجود دارد که در ادامه هر یک را شرح خواهیم داد .

    آموزش کار با رنگ ها یا Colors در HTML

    از رنگها توسط سه شیوه RGB و HEX و Name می توان استفاده کرد. مثلا هر سه دستور زیر رنگ پس زمینه را به سیاه تغییر خواهند داد.

    • <body bgcolor=”#000000″>
    • <body bgcolor=”rgb(0,0,0)”>
    • <body bgcolor=”black”>

    در استفاده از رنگها بهتر است از شیوه Name استفاده نکنید و دو شیوه دیگر را به کار ببرید چون نام رنگها برای همه مرورگرها قابل استفاده نمی باشد.
    توسط دستور rgb می توانید تا ۱۶ میلیون رنگ بسازید یعنی ۲۵۶×۲۵۶×۲۵۶ . نمونه ای از نام رنگها و شماره های آنها را در جدول بعد می بینید.

    کار با رنگ ها یا Colors در HTML

    رنگ متن‌ها را در اچ تی ام ال به دو شکل می‌توان تعیین کرد. در حالت اول, رنگ نوشته‌ها را با رنگ‌های پیش فرض (مثلا blue، yellow یا …) مشخص می‌کنند.
    در این حالت انتخاب‌ها به رنگ‌های از پیش تعریف شده محدود می‌شود, ولی اگر قصد استفاده از رنگ خاصی را دارید باید از کد شش رقمی آن‌ها در کنار علامت # استفاده کنید.
    مثلا 888888# رنگ سفید یا FF330A# رنگ نارنجی است.
    برای به دست آوردن کد رنگ‌ها می‌توانید از نرم افزارهای گرافیکی همچون فوتوشاپ یا سرویس‌های آنلاین همچون HTML Color یا HTML Color picker استفاده نمایید.

    کدهگزادسیمال

    کدهگزادسیمال رنگ ها در طراحی وب یا به انگلیسی Hexadecimal

    در شروع کار، نیازی به یادگیری و تسلط کامل بر این روش رو ندارین، چرا که می‌تونه کمی سردرگمتون کنه. اما در آینده،
    اکثز رنگ آمیزی های خودتونو با این روش انجام خواهید داد. چرا که روش بسیار قدرتمند و گسترده‌ای محسوب میشه.

    دوست عزیز پیشنهاد میشه این مطلب را هم ببینید
    آموزش html و css جلسه 1 معرفی html چیست ؟

    طبق این روش، به هر رنگ، یک کد می‌تونیم اختصاص بدیم. کد هر رنگ، تلفیقی از رنگ های قرمز، سبز و آبی هست و به فرم کلی rrggbb# نشون داده میشه.
    بازه هر رنگ از 00 تا ff ادامه داره و روشنایی و تاریکی هر رنگ رو تنظیم می‌کنه.

    یک مثال از کدها و رنگ های تولید شده به کد های زیر دقت نمایید.

    نام فارسی HEX کد رنگ کد رنگ RGB نمونه رنگ
    نیلی کمرنگ #E6E6FA rgb(230,230,250)
    بادمجانی روشن #D8BFD8 rgb(216,191,216)
    بنفش کدر #DDA0DD rgb(221,160,221)
    بنفش روشن #EE82EE rgb(238,130,238)
    سرخابی #FF00FF rgb(255,0,255)
    ارکیده #DA70D6 rgb(218,112,214)
    ارکیده سیر #BA55D3 rgb(186,85,211)
    آبی بنفش #9370DB rgb(147,112,219)
    آبی فولادی #6A5ACD rgb(106,90,205)
    آبی-بنفش سیر #8A2BE2 rgb(138,43,226)
    بنفش باز #9400D3 rgb(148,0,211)
    ارکیده بنفش #9932CC rgb(153,50,204)
    مخملی #8B008B rgb(139,0,139)
    بنفش #800080 rgb(128,0,128)
    آبی دودی #483D8B rgb(72,61,139)
    نیلی سیر #4B0082 rgb(75,0,130)

    به نکته زیر توجه کنید و خوب اون رو به خاطر بسپارید:

    یک رنگ از 255 قسمت تشکیل شده، هرچی 255 کمتر شه رنگ تاریک‌تر و هرچی بیشتر شه رنگ روشن‌تر میشه

    هگز (HEX) استانداردی از طیف های رنگی بر مبنای عدد 16 (Hexadecimal) است که مقادیر آن از ترکیب اعداد 0-9 و حروف A, B, C, D, E, F تشکیل شده و در وب کاربردهای زیادی دارد،
    مخصوصا در استایل نویسی با خاصیت های CSS، هر کد و ترکیب اعداد و حروف در این سیستم نمایانگر یک رنگ استاندارد است،
    به طور مثال عدد 000000 رنگ مشکی و حروف FFFFFF رنگ سفید را نشان می دهند.

    کار با رنگ ها یا Colors در HTML مدل رنگ آر جی بی ( RGB )

     

    RGB در واقع مخفف سه رنگ اصلی قرمز، سبز و آبی (Red, Green, Blue) است و در اصطلاح به استانداردی گفته می شود که برای نمایش رنگ های مختلف در دستگاه های الکترونیکی نظیر مانیتورها کاربرد دارد،
    در این سیستم از ترکیب مقادیر سه رنگ اصلی قرمز، سبز و آبی، برای ایجاد یک رنگ جدید استفاده می شود،
    مقادیر هر رنگ نیز می تواند بین 0 (تیره) تا 255 (روشن) در نوسان باشد،
    RGB موارد استفاده فراوانی دارد، از جمله در کارهای گرافیکی، برنامه نویسی و…

    دوست عزیز پیشنهاد میشه این مطلب را هم ببینید
    آموزش رفع مشکل فارسی نویسی در Adobe Illustrator CC 2018

    در این آموزش کار با رنگ ها یا Colors در HTML مفهوم تعیین رنگ را آشنا شدیم و همچنین متوجه شدیم که مقادیر پیش فرض چه مقادیری هستند و چگونه می‌توانیم از آن ها استفاده کنیم.

    همچنین با کد رنگ های مبنای 16 یا HEX نیز آشنا شدیم و متوجه شدیم که چگونه تعریف می‌شوند و در چه مواردی از آن‌ ها استفاده می‌شود.

    شما می‌توانید در رابطه با دیگر روش های تعیین رنگ در فصل چهارم یعنی فصل رنگ ها بیشتر بخوانید.

    در پایان هم یک تعداد رنگ که توسط کد های Hexadecimal و rgb تولید شده است را خدمت شما قرار دادم میتوایند استفاده لازم را ببرید هر گونه نظر یا پیشنهادی داشته باشید توی قسمت نظرات سایت برای من بنیسید.

    آموزش کار با رنگ ها

    تعداد 140 رنگ در CSS و HTML نام استاندارد تعریف شده که تمام مرورگرهای مدرن از این نام رنگ ها پشتیبانی می کنند. کلیه 140 رنگ همراه با نام و مقادیر HEX و RGB در جدول زیر قابل مشاهده هستند.

     

    Color RGB Code HEX Code Color Name
    rgb(240,248,255) #F0F8FF AliceBlue
    rgb(250,235,215) #FAEBD7 AntiqueWhite
    rgb(0,255,255) #00FFFF Aqua
    rgb(127,255,212) #7FFFD4 Aquamarine
    rgb(240,255,255) #F0FFFF Azure
    rgb(245,245,220) #F5F5DC Beige
    rgb(255,228,196) #FFE4C4 Bisque
    rgb(0,0,0) #000000 Black
    rgb(255,235,205) #FFEBCD BlanchedAlmond
    rgb(0,0,255) #0000FF Blue
    rgb(138,43,226) #8A2BE2 BlueViolet
    rgb(165,42,42) #A52A2A Brown
    rgb(222,184,135) #DEB887 BurlyWood
    rgb(95,158,160) #5F9EA0 CadetBlue
    rgb(127,255,0) #7FFF00 Chartreuse
    rgb(210,105,30) #D2691E Chocolate
    rgb(255,127,80) #FF7F50 Coral
    rgb(100,149,237) #6495ED CornflowerBlue
    rgb(255,248,220) #FFF8DC Cornsilk
    rgb(220,20,60) #DC143C Crimson
    rgb(0,255,255) #00FFFF Cyan
    rgb(0,0,139) #00008B DarkBlue
    rgb(0,139,139) #008B8B DarkCyan
    rgb(184,134,11) #B8860B DarkGoldenRod
    rgb(169,169,169) #A9A9A9 DarkGray
    rgb(169,169,169) #A9A9A9 DarkGrey
    rgb(0,100,0) #006400 DarkGreen
    rgb(189,183,107) #BDB76B DarkKhaki
    rgb(139,0,139) #8B008B DarkMagenta
    rgb(85,107,47) #556B2F DarkOliveGreen
    rgb(255,140,0) #FF8C00 DarkOrange
    rgb(153,50,204) #9932CC DarkOrchid
    rgb(139,0,0) #8B0000 DarkRed
    rgb(233,150,122) #E9967A DarkSalmon
    rgb(143,188,143) #8FBC8F DarkSeaGreen
    rgb(72,61,139) #483D8B DarkSlateBlue
    rgb(47,79,79) #2F4F4F DarkSlateGray
    rgb(47,79,79) #2F4F4F DarkSlateGrey
    rgb(0,206,209) #00CED1 DarkTurquoise
    rgb(148,0,211) #9400D3 DarkViolet
    rgb(255,20,147) #FF1493 DeepPink
    rgb(0,191,255) #00BFFF DeepSkyBlue
    rgb(105,105,105) #696969 DimGray
    rgb(105,105,105) #696969 DimGrey
    rgb(30,144,255) #1E90FF DodgerBlue
    rgb(178,34,34) #B22222 FireBrick
    rgb(255,250,240) #FFFAF0 FloralWhite
    rgb(34,139,34) #228B22 ForestGreen
    rgb(255,0,255) #FF00FF Fuchsia
    rgb(220,220,220) #DCDCDC Gainsboro
    rgb(248,248,255) #F8F8FF GhostWhite
    rgb(255,215,0) #FFD700 Gold
    rgb(218,165,32) #DAA520 GoldenRod
    rgb(128,128,128) #808080 Gray
    rgb(128,128,128) #808080 Grey
    rgb(0,128,0) #008000 Green
    rgb(173,255,47) #ADFF2F GreenYellow
    rgb(240,255,240) #F0FFF0 HoneyDew
    rgb(255,105,180) #FF69B4 HotPink
    rgb(205,92,92) #CD5C5C IndianRed
    rgb(75,0,130) #4B0082 Indigo
    rgb(255,255,240) #FFFFF0 Ivory
    rgb(240,230,140) #F0E68C Khaki
    rgb(230,230,250) #E6E6FA Lavender
    rgb(255,240,245) #FFF0F5 LavenderBlush
    rgb(124,252,0) #7CFC00 LawnGreen
    rgb(255,250,205) #FFFACD LemonChiffon
    rgb(173,216,230) #ADD8E6 LightBlue
    rgb(240,128,128) #F08080 LightCoral
    rgb(224,255,255) #E0FFFF LightCyan
    rgb(250,250,210) #FAFAD2 LightGoldenRodYellow
    rgb(211,211,211) #D3D3D3 LightGray
    rgb(211,211,211) #D3D3D3 LightGrey
    rgb(144,238,144) #90EE90 LightGreen
    rgb(255,182,193) #FFB6C1 LightPink
    rgb(255,160,122) #FFA07A LightSalmon
    rgb(32,178,170) #20B2AA LightSeaGreen
    rgb(135,206,250) #87CEFA LightSkyBlue
    rgb(119,136,153) #778899 LightSlateGray
    rgb(119,136,153) #778899 LightSlateGrey
    rgb(176,196,222) #B0C4DE LightSteelBlue
    rgb(255,255,224) #FFFFE0 LightYellow
    rgb(0,255,0) #00FF00 Lime
    rgb(50,205,50) #32CD32 LimeGreen
    rgb(250,240,230) #FAF0E6 Linen
    rgb(255,0,255) #FF00FF Magenta
    rgb(128,0,0) #800000 Maroon
    rgb(102,205,170) #66CDAA MediumAquaMarine
    rgb(0,0,205) #0000CD MediumBlue
    rgb(186,85,211) #BA55D3 MediumOrchid
    rgb(147,112,219) #9370DB MediumPurple
    rgb(60,179,113) #3CB371 MediumSeaGreen
    rgb(123,104,238) #7B68EE MediumSlateBlue
    rgb(0,250,154) #00FA9A MediumSpringGreen
    rgb(72,209,204) #48D1CC MediumTurquoise
    rgb(199,21,133) #C71585 MediumVioletRed
    rgb(25,25,112) #191970 MidnightBlue
    rgb(245,255,250) #F5FFFA MintCream
    rgb(255,228,225) #FFE4E1 MistyRose
    rgb(255,228,181) #FFE4B5 Moccasin
    rgb(255,222,173) #FFDEAD NavajoWhite
    rgb(0,0,128) #000080 Navy
    rgb(253,245,230) #FDF5E6 OldLace
    rgb(128,128,0) #808000 Olive
    rgb(107,142,35) #6B8E23 OliveDrab
    rgb(255,165,0) #FFA500 Orange
    rgb(255,69,0) #FF4500 OrangeRed
    rgb(218,112,214) #DA70D6 Orchid
    rgb(238,232,170) #EEE8AA PaleGoldenRod
    rgb(152,251,152) #98FB98 PaleGreen
    rgb(175,238,238) #AFEEEE PaleTurquoise
    rgb(219,112,147) #DB7093 PaleVioletRed
    rgb(255,239,213) #FFEFD5 PapayaWhip
    rgb(255,218,185) #FFDAB9 PeachPuff
    rgb(205,133,63) #CD853F Peru
    rgb(255,192,203) #FFC0CB Pink
    rgb(221,160,221) #DDA0DD Plum
    rgb(176,224,230) #B0E0E6 PowderBlue
    rgb(128,0,128) #800080 Purple
    rgb(102,51,153) #663399 RebeccaPurple
    rgb(255,0,0) #FF0000 Red
    rgb(188,143,143) #BC8F8F RosyBrown
    rgb(65,105,225) #4169E1 RoyalBlue
    rgb(139,69,19) #8B4513 SaddleBrown
    rgb(250,128,114) #FA8072 Salmon
    rgb(244,164,96) #F4A460 SandyBrown
    rgb(46,139,87) #2E8B57 SeaGreen
    rgb(255,245,238) #FFF5EE SeaShell
    rgb(160,82,45) #A0522D Sienna
    rgb(192,192,192) #C0C0C0 Silver
    rgb(135,206,235) #87CEEB SkyBlue
    rgb(106,90,205) #6A5ACD SlateBlue
    rgb(112,128,144) #708090 SlateGray
    rgb(112,128,144) #708090 SlateGrey
    rgb(255,250,250) #FFFAFA Snow
    rgb(0,255,127) #00FF7F SpringGreen
    rgb(70,130,180) #4682B4 SteelBlue
    rgb(210,180,140) #D2B48C Tan
    rgb(0,128,128) #008080 Teal
    rgb(216,191,216) #D8BFD8 Thistle
    rgb(255,99,71) #FF6347 Tomato
    rgb(64,224,208) #40E0D0 Turquoise
    rgb(238,130,238) #EE82EE Violet
    rgb(245,222,179) #F5DEB3 Wheat
    rgb(255,255,255) #FFFFFF White
    rgb(245,245,245) #F5F5F5 WhiteSmoke
    rgb(255,255,0) #FFFF00 Yellow
    rgb(154,205,50) #9ACD32 YellowGreen
    دوست عزیز پیشنهاد میشه این مطلب را هم ببینید
    آموزش ثبت نام و ساخت صفحه در فیس بوک +فیلم

    میانگین امتیازات ۵ از ۵
    از مجموع ۱ رای
    اشتراک گذاری:

    مطالب مرتبط برای شما

    نظر یا سوال شما در این مورد چیست؟

    توجه داشته باشید که نشانی ایمیل شما منتشر نخواهد شد.

      هیچ دیدگاهی برای این نوشته ثبت نشده است.