Learn CSS: Layout & Design

CSS را گام به گام یاد بگیرید، از اولین انتخابگر خود گرفته تا طرح‌بندی‌های واکنش‌گرا، انیمیشن‌ها و طراحی وب مدرن. یک خط CSS تایپ کنید و تغییر صفحه را در تلفن خود تماشا کنید: ویرایشگر HTML و CSS شما را در کنار هم با یک پیش‌نمایش زنده نشان می‌دهد.

این آموزش CSS برای مبتدیان ساخته شده است و با شما رشد می‌کند. هر دوره یک موضوع واقعی است، هر درس کوتاه است و ویرایشگر همیشه با یک لمس فاصله دارد، بنابراین شما آنچه را که خوانده‌اید تمرین می‌کنید به جای اینکه فقط در مورد آن بخوانید.

محتویات داخل

• ۴۰ دوره و ۱۵۹ درس کوتاه، از مبتدی (A1) تا پیشرفته (C1)

• یک ویرایشگر زنده HTML و CSS با پیش‌نمایش فوری، برای آزمایش‌های سریع و صفحات خودتان

• ۲۰ پروژه طراحی وب هدایت‌شده، گام به گام: یک نوار ابزار، یک شبکه کارت، یک هدر چسبنده، یک دکمه ضربان‌دار و موارد دیگر

• ۲۰ ماموریت شکار اشکال: یک کارت ۴۲ پیکسل پهن‌تر از ستون آن، یک پرس‌وجوی رسانه‌ای که هرگز روی تلفن اجرا نمی‌شود، یک مودال که در پشت صفحه گیر کرده است

• یک امتحان نهایی و یک گواهی تکمیل

• این برنامه به ۲۲ زبان موجود است

یک مسیر کامل، از مبتدی تا پیشرفته

• سینتکس و انتخابگرها، رنگ‌ها، پس‌زمینه‌ها و تایپوگرافی

• مدل جعبه، نمایش، موقعیت‌یابی، واحدها و مقادیر

• شبه‌کلاس‌ها و شبه‌عناصر

• اصول Flexbox و Flexbox پیشرفته

• اصول اولیه Grid، نواحی Grid و طرح‌بندی Grid پیشرفته

• واکنش‌گرا طراحی، کوئری‌های رسانه‌ای و کوئری‌های کانتینر

• ویژگی‌های سفارشی (متغیرها)، توابع، ویژگی، آبشار و @لایه

• انتقال‌ها، تبدیل‌ها، انیمیشن فریم کلیدی، فیلترها و حالت‌های ترکیبی

• حالت تاریک و طرح‌های رنگی، پیمایش و سرریز، مسیر کلیپ و اشکال

• اشکال‌زدایی با DevTools، معماری BEM، Sass، PostCSS و توکن‌های طراحی

• الگوهای کامپوننت، الگوهای طرح‌بندی مدرن، عملکرد و Houdini

تمرینی که ماندگار است

• آزمون‌هایی برای بررسی آموخته‌های شما

• یک برگه تقلب با ۶۹ ​​مدخل از ویژگی‌ها، انتخابگرها و سینتکس طرح‌بندی

• ۵۰ سوال مصاحبه با پاسخ‌های واضح، مفید قبل از مصاحبه توسعه‌دهنده فرانت‌اند یا وب

• یک کتابخانه کد از مثال‌های کوتاه که می‌توانید باز و ویرایش کنید

• کد، یادداشت‌ها و درس‌های مورد علاقه خود را ذخیره کنید

• چالش جهانی کدنویسی: سه دور جهانی در روز، حل شده در پایتون، جاوا اسکریپت و زبان‌های دیگر

• Streaks، XP، یک جدول امتیازات و یادآوری‌های روزانه برای ادامه تمرین شما

مربی هوش مصنوعی

• گیر کردن در یک طرح‌بندی یا یک ویژگی؟ از مربی هوش مصنوعی در مورد یک مفهوم، یک خطا یا کد خودتان بپرسید.

• زمین بازی هوش مصنوعی: یک صفحه را توصیف کنید و ساخت HTML و CSS را تماشا کنید.

• کاربران رایگان، سهمیه روزانه هوش مصنوعی دریافت می‌کنند. حرفه‌ای، نامحدود می‌کند

برای چه کسانی است

• مبتدیان کامل که اولین گام‌های خود را در توسعه وب برمی‌دارند

• طراحانی که می‌خواهند به جای تحویل ماکت‌ها، صفحات خود را طراحی کنند

• دانشجویانی که می‌خواهند در کنار یک دوره طراحی وب، تمرین بیشتری داشته باشند

• توسعه‌دهندگانی که کمی HTML و CSS می‌دانند و می‌خواهند در نهایت flexbox و grid را درک کنند

• افرادی که شغل خود را تغییر می‌دهند و برای یک کار front end آماده می‌شوند

نحوه کار

۱. با دوره اول رایگان شروع کنید: سینتکس و انتخابگرهای CSS

۲. ویرایشگر را باز کنید، یک مقدار را تغییر دهید و پیش‌نمایش را تماشا کنید

۳. در مسیر بالا بروید: مدل جعبه‌ای، flexbox، grid، طراحی واکنش‌گرا و انیمیشن

۴. پروژه‌های هدایت‌شده بسازید و اشکالات طرح‌بندی واقعی را در ماموریت‌ها برطرف کنید

۵. در امتحان نهایی قبول شوید و گواهینامه خود را کسب کنید

رایگان و حرفه‌ای

دوره اول، اولین پروژه هدایت‌شده، دو ماموریت و ویرایشگر زنده رایگان هستند، با کمک هزینه روزانه مربی هوش مصنوعی. حرفه‌ای، هر دوره، همه پروژه‌ها و ماموریت‌ها، آزمون گواهینامه و هوش مصنوعی نامحدود را باز می‌کند و تبلیغات را حذف می‌کند.

همین امروز شروع کنید، CSS را با سرعت دلخواه خود یاد بگیرید و اولین صفحه خود را در عرض چند دقیقه استایل‌دهی کنید.