CSS1 دقیقه مطالعه
CSS چیست؟
زبانی برای استایلدهی به عناصر HTML — رنگ، فاصله، چیدمان و واکنشگرایی صفحه.
چرا مهم است؟
بدون CSS هر صفحه وب فقط متن ساده و بدون چیدمان است. تسلط به Box Model، Flexbox و Grid پیشنیاز هر کار فرانتاندی جدی است.
تعریف
CSS (Cascading Style Sheets) مشخص میکند عناصر HTML چطور نمایش داده شوند: رنگ، فونت، فاصله، اندازه و چیدمان (Layout).
نحو پایه
.card {
display: flex;
gap: 1rem;
padding: 16px;
border-radius: 8px;
background-color: #f5f5f5;
}
Box Model
هر عنصر از داخل به بیرون این لایهها را دارد: content → padding → border → margin. اشتباهگرفتن این چهار لایه شایعترین منبع باگهای چیدمان است.
Flexbox در برابر Grid
| Flexbox | Grid | |
|---|---|---|
| بعد | یکبعدی (سطر یا ستون) | دوبعدی (سطر و ستون همزمان) |
| کاربرد رایج | چیدمان اجزای یک نوار/کارت | چیدمان کلی صفحه |
اشتباه رایج
❌ استفاده از float برای چیدمانهای امروزی — روش قدیمی و شکننده است؛ بهجایش Flexbox/Grid.
منبع و مطالعه بیشتر
خلاصه
CSS چیدمان و ظاهر صفحه را کنترل میکند. Box Model پایه همهچیز است و برای چیدمان مدرن باید Flexbox/Grid را جایگزین float کرد. مرجع کامل: MDN و W3Schools.
حالا امتحان کن
🧩آزمون CSS4 سؤال · نمره قبولی 60٪این مطلب مفید بود؟
☆نشان کردن