دوره آموزشی یادگیری جامع CSS نسخه (2019)
4 ساعت 30 دقیقهمبتدی2019-10-01
مدرسین

Christina Truong
Educator, Front-End Developer
جزئیات دوره
Cascading Style Sheets (CSS) یک زبان صفحه است که به شما امکان می دهد ظاهر صفحات وب خود را کنترل کنید. در این دوره عملی، کریستینا تروونگ مفاهیمی را که پایه و اساس CSS را تشکیل می دهد، نشان می دهد و آنچه را که باید برای تغییر CSS موجود و نوشتن خود بدانید باید بدانید، توضیح می دهد. کریستینا توضیح می دهد که چگونه می توان رنگ ها و سایر عناصر طراحی را اضافه کرد تا صفحات وب شما فراتر از متن سیاه در زمینه سفید باشد. او نحوه استفاده از انتخاب کننده ها، نحوه تعریف فاصله بین اندازه و اندازه عناصر صفحه و نحوه سبک بندی متن و مدیریت طرح بندی های اساسی با Flexbox و Grid را نشان می دهد. او همچنین کار با انتخاب کننده های پیشرفته، ایجاد طرح بندی سیال و تعیین زمان استفاده از ویژگی های شناور و موقعیت را پوشش می دهد. به علاوه، در پایان دوره، با یک پروژه واقعی - یک صفحه رزومه آنلاین - کنار می روید.
اهداف یادگیری
نوشتن انتخاب کننده های اصلی
تنظیم خواص
آبشار و وراثت
تنظیم خانواده فونت، اندازه فونت، رنگ متن و موارد دیگر
کار با مدل جعبه
استفاده از شبکه و Flexbox
با استفاده از خواص float و position
کار با انتخاب کننده های پیشرفته
ایجاد چیدمان های روان
اهداف یادگیری
نوشتن انتخاب کننده های اصلی
تنظیم خواص
آبشار و وراثت
تنظیم خانواده فونت، اندازه فونت، رنگ متن و موارد دیگر
کار با مدل جعبه
استفاده از شبکه و Flexbox
با استفاده از خواص float و position
کار با انتخاب کننده های پیشرفته
ایجاد چیدمان های روان
مهارت ها
CSSWeb StandardsWeb DesignFront-End Web DevelopmentEssential TrainingWeb DevelopmentOpen Source
سرفصل ها
0. مقدمه
- 01 - اسناد را به طور مداوم یک ظاهر طراحی کنید
- 02 - آنچه باید بدانید
- 03 - ابزار و پروژههای نمونه
1. شروع به کار
- 04 - HTML و CSS
- 05 - ابزارهای توسعه دهنده مرورگر
- 06 - ارجاع به CSS
- 07 - نمای کلی پروژه و راه اندازی
- 08 - بهینهسازی تصاویر و نمایشگرهای شبکیه چشم
- 09 - پروژه - مسیرهای نسبی
- 10 - مسیرهای مطلق
2. مفاهیم اصلی
- 11 - مشخصات CSS و W3C
- 12 - نحو و اصطلاحات CSS
- 13 - مقادیر و واحدهای CSS
- 14 - مقادیر رنگ و ویژگی
- 15 - انتخابگرهای نوع و جهانی
- 16 - انتخابگرهای کلاس و شناسه
- 17 - تمرین انتخابگر کلاس و شناسه
- 18 - منتخب نوادگان
- 19 - انتخابگرهای گروه بندی
- 20 - وراثت و اختصاصیت
- 21 - waterfall و اهمیت
- 22 - پروژه - افزودن رنگ
- 23 - انتخابگرها و پیوندهای شبه کلاس
- 24 - پروژه - لینکهای استایل
3. مدل جعبه
- 25 - آشنایی با مدل جعبه
- 26 - درون خطی، مسدود کردن، و نمایش
- 27 - خواص مدل جعبه
- 28 - نحو و نحوه استفاده از ویژگیهای جعبه
- 29 - اشکال زدایی مدل جعبه
- 30 - بالشتک، حاشیه و حاشیه
- 31 - حاشیه و چیدمان
- 32 - پروژه - افزودن بستههای محتوا
- 33 - پروژه - حاشیه و بالشتک
4. تایپوگرافی
- 34 - تایپوگرافی برای وب
- 35 - تغییر خانواده فونت
- 36 - وزن و سبک قلم
- 37 - فونتهای وب با @font-face
- 38 - فونتهای وب با فونتهای گوگل
- 39 - پروژه - فونتهای گوگل
- 40 - خاصیت font-size
- 41 - کوتاه نویسی قلم
- 42 - تزیین متن، تراز کردن متن و ارتفاع خط
- 43 - پروژه - سبکهای تایپوگرافی
5. طرح بندی - شناور و موقعیت
- 44 - مقدمه شناور
- 45 - خواص شناور و شفاف
- 46 - ظرف شناور و فرو ریخته
- 47 - چیدمان و مدل جعبه
- 48 - پروژه - تعمیر مدل شناور و جعبه
- 49 - مقام
- 50 - موقعیت و z-index
6. Layouts - Flexbox و Grid
- 51 - مقدمه ای بر گرید و فلکس باکس
- 52 - مقدمه ای بر فلکس باکس
- 53 - فلکس باکس - جهت گیری و سفارش
- 54 - سایزبندی انعطاف پذیر
- 55 - تمرین فلکس باکس
- 56 - Flexbox - تراز
- 57 - پروژه - تراز Flexbox
- 58 - مقدمه ای بر CSS Grid
- 59 - شبکه صریح
- 60 - شبکه ضمنی
- 61 - خواص قرارگیری شبکه
- 62 - پروژه - ستونهای Grid و Firefox Grid Inspector
7. انتخابگرهای پیشرفته
- 63 - آشنایی با سلکتورهای پیشرفته
- 64 - انتخابگرهای رابطه ای - ترکیبی
- 65 - پروژه - به روز رسانی با ترکیب
- 66 - انتخابگرهای شبه کلاس - اول و آخر
- 67 - پروژه - انتخابگرهای پیشرفته
8. چیدمانهای سیال و پاسخگو
- 68 - مقدمه ای بر طراحی واکنش گرا
- 69 - پروژه - ایجاد طرح بندی سیال
- 70 - تصاویر پس زمینه انعطاف پذیر
- 71 - پروژه - تصویر پس زمینه انعطاف پذیر
- 72 - مقدمه ای بر کوئریهای رسانه ای
- 73 - کوئریهای رسانه، عرضها و نقاط شکست
- 74 - تست طرحبندیهای واکنشگرا
- 75 - پروژه - پرسشهای رسانهای و طرح پاسخگو
نتیجه
- 76 - مراحل بعدی
دوره های مرتبط
- دوره آموزشی جعبه ابزار CSS: نکات و روشهای طراحی و چینش صفحه
- دوره آموزشی CSS: طرحبندیهای پیشرفته با Grid
- دوره آموزشی CSS برای توسعهدهندگان
- دوره آموزشی HTML، CSS و جاوااسکریپت: ساخت وب
- دوره آموزشی طرح بندی قابل دسترسی برای وب
- دوره آموزشی فرم های HTML: قابلیت دسترسی
- دوره آموزشی مقدمه ای بر طراحی و توسعه وب
- دوره آموزشی آن را تمرین کن: طرح بندی CSS