آموزش کامل CSS
از صفر تا قهرمان CSS — مباحث جامع، کاربردی و پروژهمحور
در این آموزش جامع، CSS را از مبانی تا پیشرفته یاد میگیرید. هر مبحث با توضیحات کامل، مثالهای عملی و ویرایشگر کد آنلاین همراه است.
فهرست مباحث این دوره
- معرفی CSS
- روشهای افزودن استایل
- ساختار و قواعد نوشتاری
- انتخابگرها (Selectors)
- کامنتگذاری
- خطاهای رایج و رفع آنها
- رنگها (Colors)
- پسزمینه (Background)
- حاشیهها (Border)
- فاصله خارجی (Margin)
- فاصله داخلی (Padding)
- عرض و ارتفاع
- مدل جعبه (Box Model)
- طرح کلی (Outline)
- استایل متن (Text)
- فونتها (Fonts)
- آیکونها (Icons)
- استایل لینکها
- استایل لیستها
- استایل جداول
- نمایش (Display)
- حداکثر ابعاد (Max-width)
- موقعیتیابی (Position)
- افستهای موقعیتیابی
- لایهبندی (Z-index)
- سرریز (Overflow)
- شناورسازی (Float)
- نمایش Inline-block
- ترازبندی (Align)
- ترکیبکنندهها (Combinators)
- شبهکلاسها (Pseudo-classes)
- شبهعناصر (Pseudo-elements)
- شفافیت (Opacity)
- نوار ناوبری (Navbar)
- منوی کشویی (Dropdown)
- گالری تصاویر
- اسپرایت تصویری (Image Sprites)
- انتخابگرهای ویژگی (Attribute Selectors)
- استایل فرمها
- شمارندهها (Counters)
- واحدها (Units)
- وراثت (Inheritance)
- اولویت قوانین (Specificity)
- قانون !important
- توابع ریاضی (Math Functions)
- بهینهسازی CSS
- دسترسپذیری (Accessibility)
- چیدمان وبسایت
- گوشههای گرد
- سایهها (Shadows)
- طیف رنگی (Gradients)
- تبدیلات دوبعدی (2D Transforms)
- انتقالها (Transitions)
- انیمیشنها (Animations)
- تبدیلات سهبعدی (3D Transforms)
- متغیرهای CSS
- دکمههای پیشرفته
- ویژگی box-sizing
- پرسشهای رسانهای (Media Queries)
- معرفی فلکسباکس
- کانتینر فلکس (Flex Container)
- آیتمهای فلکس (Flex Items)
- فلکسباکس واکنشگرا
- معرفی گرید (Grid)
- کانتینر گرید (Grid Container)
- آیتمهای گرید (Grid Items)
- چیدمان ۱۲ ستونه با گرید
- قانون @supports
- طراحی واکنشگرا (RWD)
- ویوپورت (Viewport)
- تصاویر واکنشگرا
- فریمورکهای CSS
- فیلترهای تصویری
- صفحهبندی (Pagination)
- راهنمای ابزار (Tooltip)
- @property در CSS
- ستونهای متعدد (Multiple Columns)