خبر و ترفند روز

خبر و ترفند های روز را اینجا بخوانید!

نحوه استفاده از CSS برای تغییر رنگ فونت

با مقداری CSS یک خط رنگ به طراحی های وب خود اضافه کنید تا متن خود را روشن تر کنید.

آیا به دنبال تقویت وب سایت خود با رنگ های مختلف فونت هستید؟ شما می توانید این کار را با استفاده از CSS انجام دهید. CSS مخفف Cascading Style Sheets است و زبان پیش‌فرض برای ایجاد و مدیریت سبک هر وب‌سایتی است.

سه روش برای اعمال CSS در یک سند HTML وجود دارد. اینها CSS درون خطی، CSS داخلی/جاسازی شده و CSS خارجی هستند.

روش اول: CSS درون خطی

برای تغییر رنگ فونت در CSS، باید یک قانون CSS برای تنظیم مقدار ویژگی رنگ ایجاد کنید.

متد درون خطی از ویژگی 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” را نگه دارید، می توانید آن را هر چیزی نامگذاری کنید.

مطلب مرتبط:   6 بهترین سایت برای استخدام برنامه نویسان و برنامه نویسان آزاد

برای رنگ آمیزی متن بدن خود به رنگ سبز، به عنوان مثال، با استفاده از یک stylesheet خارجی، به سادگی در قانون 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 مسلط شوید.