نحوه استفاده از CSS برای تغییر رنگ فونت
با کدهای CSS ، می توانید رنگ فونت صفحه خود را تغییر دهید تا متن خود را روشن تر کنید.
آیا به دنبال تقویت وب سایت خود با رنگ های مختلف فونت هستید؟ شما می توانید این کار را با استفاده از CSS انجام دهید. CSS مخفف Cascading Style Sheets است و زبان پیش فرضی است که برای ایجاد و مدیریت سبک هر وب سایتی استفاده می شود.
سه روش برای اعمال CSS در یک سند HTML وجود دارد. CSS درون خطی، CSS داخلی/جاسازی شده و CSS خارجی هستند.
روش اول: CSS درون خطی
برای تغییر رنـگ فونت در CSS، باید یک قانون CSS ایجاد کنید تا مقدار ویژگی رنگ را تنظیم کنید.
متد inline از ویژگی style استفاده می کند که می توانید تقریباً برای هر عنصری اعمال کنید. در ادامه یک مثال وجود دارد که رنگ فونت یک پاراگراف HTML را قرمز تنظیم می کند:
<p style="color: red;">Paragraph of text</p>
شما می توانید با استفاده از CSS داخلی/جاسازی شده یا CSS خارجی به همین اثر برسید.
روش دوم: CSS داخلی/جاسازی شده
هنگامی که می خواهید قوانین CSS را ایجاد کنید که بیش از یک نمونه از یک عنصر HTML را تحت تاثیر قرار می دهند، اما فقط در یک صفحه، ممکن است از این روش استفاده کنید. سپس قوانین CSS با استفاده از یک عنصر سبک در سر صفحه HTML نوشته می شود:
<head> <style> p { color: blue } </style> </head>
روش سوم: CSS خارجی
راه سوم برای دستیابی به همین اثر استفاده از یک صفحه سبک CSS خارجی است. با استفاده از یک ویرایشگر متن، یک فایل با پسوند “css.” ایجاد کنید. روش معمول این است که این فایل را چیزی مانند stylesheet.css نام گذاری کنید، اما پسوند را حتما “css.” نگه دارید، می توانید آن را هر چیزی نامگذاری کنید.
به عنوان مثال، برای رنگ آمیزی متن بدن خود به رنگ سبز، با استفاده از یک شیوه نامه خارجی، به سادگی در CSS قطعه کد زیر را قرار دهید:
p { color: blue }
در سند HTML خود، باید پیوندی به شیوه نامه خود در عنصر <head> فایل HTML قرار دهید:
<html> <head> <link rel="stylesheet" href="stylesheet.css"> </head> <body> <p>Paragraph of text</p> </body> </html>
تغییر رنگ فونت در HTML، بدون استفاده از CSS
بهترین روش استفاده از CSS است، اما در ادامه نحوه تغـیـیر رنگ فونت تنها با استفاده از HTML آمده است:
<p><font color="red">Paragraph of text</font></p>
عنصر فونت، همراه با ویژگی رنگ آن، منسوخ شده است. به این دلیل که آنها به جای عناصر ساختاری، نمایشی هستند. HTML مدرن فقط باید از عناصر ساختاری تشکیل شده باشد.
تغییر رنگ فونت در CSS نسبتاً ساده است
ما سه روش برای تغییر رنگ فونت در CSS به شما نشان داده ایم.ما همچنین به شما نشان دادیم که چگونه این کار را به روش قدیمی با استفاده از تگ فونت HTML انجام دهید. آنها را امتحان کنید و ببینید کدام یک برای شما بهتر کار می کند!
حالا که بر تغییر رنگ فونت با استفاده از CSS و HTML مسلط شدید، ممکن است بخواهید در رابطه با تغییر اندازه فونت در HTML هم اطلاعاتی داشته باشید.
دیدگاه ها