آموزش طراحی وب سایت با html: آشنایی با html Link Color

آموزش طراحی وب سایت با html: آشنایی با html Link Color

جلسه یادزدهم (قسمت دوم):آشنایی با html Link Color

 

آموزش طراحی وب سایت با Html

 

در جلسه قبل گفتیم که میتوان از طریق روش ها زیر، رنگ لینک های مرورگر را تغییر داد.

۱- با استفاده از HSL

۲- با استفاده از کد رنگ HEX

۳- با استفاده از RGB

۴- مستقيما نام رنگ را بنويسيم.

در جلسه گذشته با مورد ۴ و ۲ آشنا شدیم. در این جلسه میخواهیم با قابلیت های HSL و RGB در تغییر رنگ لینک ها آشنا شویم.

 

قابلیت RGB در html Color:

با استفاده از RGB میتوان رنگ مورد علاقه خود را با تغییر اعداد بدست اورید. اعداد از (۰,۰,۰) تا (۲۵۵,۲۵۵,۲۵۵) متغیر میباشند. برای مثال، هر کدام از مقادیر زیر، بیانگر یک رنگ میباشد.

 

RGB Colors
RGB Colors

 

مثال: میخواهیم با استفاده از RGB Colors، لینک سایت فرکیان تک را ایجاد کنیم و مقدار RGB آن را برابر با عدد (۰,۲۵۵,۰) قرار دهیم.

همانند جلسه قبل، ابتدا با استفاده از تگ a و عبارت href، لینک وب سایت فرکیان تک را مینویسیم. سپس یک متن یا کلمه ای را در نظر میگیریم تا به عنوان لینک، در فایل html نمایش داده شود.

<html>
<body>

<a href= “http://farkiantech.com”> Farkiantech Website </a>

</body>
</html>

سپس همانند مثال های جلسه قیل، با استفاده از کلید واژه Style، رنگ لینک را با قابلیت RGB تغییر میدهیم.

<html>
<body>

<a href= “http://farkiantech.com” style=”color : rgb (0,255,0);“> Farkiantech Website </a>

</body>
</html>

در مثال بالا، به کليد واژه rgb دقت کنيد. اين کليد واژه را حتما بايد قبل از تعيين مقدار rgb بنويسيد. نبايد بين عبارت (۰,۲۵۵,۰) , کليد واژه rgb فاصله اي وجود داشته باشد. هم اکنون پروژه بالا را ذخيره کنيد و آن را با يک مرورگر باز کنيد. ” ” همانطور که مشاهده ميکنيد، لينک به رنگ سبز تغيير کرد. 

آشنايي با HSL در html Color:

با استفاده از HSL میتوان اشباح رنگ را تغییر داد. HSL به صورت زیر ایجاد میشود. hsl in html

hue مقدار hue از عدد ۰ تا ۳۶۰ متغیر است. ۰ قرمز است, ۱۲۰ عدد سبز است, و ۲۴۰ به رنگ آبی است.

saturation یک مقدار درصد است, % به معنی سایه خاکستری است و ۱۰۰ % رنگ کامل است.

Lightness نیز یک مقدار درصدی میباشد، ۰ % سیاه است و ۱۰۰ % سفید است.

 

HSL

 

اکنون با حل یک مثال، رنگ یک لینک را با استفاده از HSL با مقدار  (%۷۲,%۳۰۰,۷۶) تغییر میدهیم.

 

<html>
<body>

<a href=”http://farkiantech.com” style = “color: hsl(147,50%,47%);” > Welcome To Farkiantech Website </a>

</body>
</html>

با ما همراه باشید.

 

 

محمد امین مکارم

مطالب مرتبط

نقد و بررسی‌ها

نظر: