استایلدهی پروژه (Add Styles)
استایلدهی پروژه: زیبا کردن سایت شما 💅
حالا وقتشه که سایت رو زیبا کنیم! با CSS میتونید رنگها، فونتها، فاصلهها و خیلی چیزهای دیگه رو کنترل کنید.
ساختار CSS پیشنهادی
/* static/css/base.css */
:root {{
--primary-color: #4caf50;
--secondary-color: #2196f3;
--text-color: #333;
--bg-color: #fff;
}}
body {{
font-family: 'Vazirmatn', sans-serif;
color: var(--text-color);
background: var(--bg-color);
line-height: 1.6;
}}
.post {{
background: #f5f5f5;
padding: 20px;
margin: 20px 0;
border-radius: 8px;
}}
CSS Variables:
استفاده از CSS Variables (Custom Properties) باعث میشه تغییر رنگها و استایلها در کل سایت خیلی راحتتر بشه!
نکته: برای پروژههای بزرگ، از یک CSS Framework مثل Bootstrap یا Tailwind استفاده کنید. این کار سرعت توسعه رو خیلی بالا میبره!
🎯 تمرین عملی:
یک سیستم رنگ برای سایت تعریف کنید (primary، secondary، success، danger) و از CSS Variables استفاده کنید. سپس استایلهای پایه برای typography و spacing بنویسید.
آماده رفتن به درس بعدی هستید؟
این درس را به پایان رساندید و میتوانید به درس بعدی بروید.