درس اول: آشنایی با CSS و روشهای استفاده از آن
دوره CSS – درس اول: آشنایی با CSS و روشهای استفاده از آن
به دنیای رنگها خوش آمدید! عبارت CSS مخفف Cascading Style Sheets است. وظیفه اصلی CSS این است که به تگهای بیروح HTML، ظاهر، رنگ و لعاب ببخشد و چیدمان آنها را در صفحه کنترل کند.
🎨 ۱. دستورات CSS چگونه نوشته میشوند؟
هر دستور CSS شامل دو بخش اصلی است: انتخابگر (Selector) که میگوید چه تگی تغییر کند، و اعلان (Declaration) که میگوید چه تغییری ایجاد شود.
h1 {
color: blue;
font-size: 20px;
}در مثال بالا، h1 انتخابگر است و ویژگیهای رنگ و اندازه فونت برای آن تنظیم شدهاند.
🛠️ ۲. سه روش اصلی برای استفاده از CSS
برای اینکه کدهای CSS را به HTML متصل کنیم، سه راه وجود دارد:
- ۱. روش درونخطی (Inline): کد را مستقیماً داخل تگ HTML مینویسیم:
<p style="color: red;">متن قرمز</p>
- ۲. روش داخلی (Internal): کدها را داخل تگ
<style>در بخشheadقرار میدهیم. - ۳. روش خارجی (External): یک فایل جداگانه با پسوند
.cssمیسازیم و آن را به HTML متصل میکنیم (بهترین روش).
🌟 چرا یادگیری CSS حیاتی است؟
بدون CSS، تمام سایتهای دنیا شبیه به هم (متن سیاه روی پسزمینه سفید) خواهند بود. CSS به شما اجازه میدهد:
- سایت خود را برای موبایل و تبلت بهینه کنید (Responsive).
- انیمیشنهای جذاب بسازید.
- چیدمانهای پیچیده (مثل ستونبندیهای مجلهای) ایجاد کنید.
🚩 اولین چالش CSS:
یک فایل HTML ساده بسازید. با استفاده از روش Inline، رنگ پسزمینه یک پاراگراف را زرد و رنگ متن آن را آبی کنید. نتیجه را در مرورگر ببینید!