How To Add CSS
چگونه CSS را به HTML اضافه کنیم؟
سه روش اصلی برای افزودن CSS به صفحات HTML وجود دارد:
۱. CSS درونخطی (Inline CSS)
میتوانید CSS را مستقیماً داخل یک تگ HTML با استفاده از ویژگی style بنویسید.
<p style=”color: blue; font-size: 16px;”>این یک پاراگراف آبی است.</p>
-
کاربرد: برای تغییرات سریع و کوچک.
-
نکته: برای پروژههای بزرگ توصیه نمیشود چون محتوا و استایل را با هم ترکیب میکند.
۲. CSS داخلی (Internal CSS)
کد CSS را داخل تگ <style> در بخش <head> سند HTML قرار میدهید.
<head>
<style>
p {
color: red;
font-size: 18px;
}
</style>
</head>
<body>
<p>این یک پاراگراف قرمز است.</p>
</body>
-
کاربرد: برای صفحات HTML تکصفحهای.
-
استایلها از محتوا جدا هستند اما هنوز داخل همان فایل HTML قرار دارند.
۳. CSS خارجی (External CSS)
کد CSS را در یک فایل جداگانه با پسوند .css مینویسید و با استفاده از تگ <link> در بخش <head> به فایل HTML وصل میکنید.
style.css:
p {
color: green;
font-size: 20px;
}
index.html:
<link rel=“stylesheet” href=“style.css”>
</head>
<body>
<p>این یک پاراگراف سبز است.</p>
</body>
-
کاربرد: بهترین روش برای استایلدهی چندین صفحه با یک سبک مشابه.
-
CSS کاملاً جدا از HTML نگهداری میشود.
کدام روش بهتر است؟
-
درونخطی: فقط برای تغییرات کوچک و سریع.
-
داخلی: مناسب صفحات تک یا تست.
-
خارجی: برای اکثر پروژهها توصیه میشود — کد تمیزتر و نگهداری آسانتر.
دیدگاهتان را بنویسید