تخفیف ویژه همین الان — دوره‌های تخفیف‌دار را ببینید.
روز
:
ساعت
:
دقیقه
:
ثانیه
تخفیف‌های ویژه
دوره آموزشی یادگیری جامع CSS آپدیت (2023)

دوره آموزشی یادگیری جامع CSS آپدیت (2023)

5 ساعت 30 دقیقهمبتدی2023-08-09

مدرسین

Christina Truong

Christina Truong

Educator, Front-End Developer

جزئیات دوره

CSS یا همون Cascading Style Sheets، یه زبان استایل‌دهی هست که به شما این امکان رو می‌ده تا ظاهر صفحات وب‌سایتتون رو کنترل کنید. توی این دوره عملی، مربی این دوره، کریستینا ترونگ، مفاهیمی رو توضیح می‌ده که پایه‌گذار CSS هستن و به شما می‌گه که چطور می‌تونید CSS‌های موجود رو تغییر بدید و به راحتی خودتون شروع به نوشتن CSS کنید. کریستینا توضیح می‌ده که چطور می‌تونید رنگ‌ها و سایر عناصر طراحی رو به صفحات وب‌سایت اضافه کنید تا صفحات شما فراتر از فقط متن سیاه روی پس‌زمینه سفید باشه. اون به شما نشون می‌ده که چطور از انتخاب‌گرها استفاده کنید، چطور مدل باکس (box model) فاصله‌ها و اندازه‌های عناصر صفحه رو تعریف می‌کنه، چطور متن رو استایل بدید و چطور چیدمان‌های پایه رو با Flexbox و Grid مدیریت کنید. همچنین با اصول تایپوگرافی، ایجاد چیدمان‌های واکنش‌گرا (responsive) و این که کی باید از خصوصیات float و position استفاده کنید آشنا می‌شید. در این مسیر، با پروژه‌های واقعی می‌تونید دانش خودتون رو تست کنید و تمرین کنید تا مهارت‌های جدید رو به کار ببرید.

مهارت ها

CSSWeb StandardsWeb DesignFront-End Web DevelopmentEssential TrainingWeb DevelopmentOpen Source

سرفصل ها

مقدمه

  • شروع کار با CSS
  • آنچه باید بدانید
  • نحوه تکمیل تمرینات

شروع به کار

  • HTML و CSS
  • کار با فایل‌های وب سایت
  • کدنویسی با ویرایشگر متن
  • ویرایشگر متن خود را سفارشی کنید
  • پروژه - بررسی اجمالی و راه اندازی
  • از کجا می‌توان تصاویر را پیدا کرد
  • بهینه‌سازی تصاویر برای وب
  • صراط نسبی و مطلق
  • پروژه - افزودن تصاویر و آیکون ها
  • ارجاع به CSS
  • پروژه - ساخت فایل CSS

مفاهیم اصلی CSS

  • مشخصات CSS و W3C
  • نحو و اصطلاحات CSS
  • مقادیر و واحدهای CSS
  • خاصیت رنگ و مقادیر
  • ایجاد یک پالت رنگ
  • انتخابگرهای نوع و جهانی
  • انتخابگرهای شناسه
  • انتخاب کنندگان کلاس
  • ترکیب کننده‌ها و لیست‌های انتخاب کننده نسل
  • خاصیت پس زمینه
  • پروژه - آماده سازی فایل CSS
  • پروژه - اضافه کردن سبک‌های پس زمینه
  • شبه طبقات و شبه عناصر
  • ارث و آبشار
  • خاص بودن
  • پروژه - پیوندهای استایل

مدل جعبه CSS

  • معرفی مدل جعبه CSS
  • خواص مدل جعبه
  • سایز بندی جعبه و مدل جعبه تعمیر می‌شود
  • درون خطی، مسدود کردن، و نمایش
  • پروژه - سبک‌ها و نمادهای پاورقی
  • اشکال زدایی با ابزارهای توسعه دهنده
  • مدیریت عجیب و غریب مدل جعبه
  • پروژه - به روز رسانی تصویر پس زمینه
  • استفاده از مقادیر حاشیه منفی
  • تراز وسط با حاشیه
  • پروژه - افزودن بسته‌های محتوا
  • پروژه - افزودن تصویر هدر

طرح بندی - شناور و موقعیت

  • مقدمه ای بر CSS Layout
  • Layouts با خاصیت float
  • پاکسازی شناورها
  • پروژه - شناور تصاویر و متن
  • ملک موقعیت
  • موقعیت و z-index
  • پروژه - موقعیت یابی ثابت

Layouts - Flexbox و Grid

  • معرفی گرید و فلکس باکس
  • معرفی فلکس باکس
  • فلکس باکس - جهت گیری و سفارش
  • سایزبندی با خواص انعطاف پذیر
  • تمرین فلکس باکس
  • پروژه - فوتر چسبنده با فلکس باکس
  • تراز کردن اقلام فلکس
  • پروژه - تراز کردن عناصر با Flexbox
  • معرفی CSS Grid
  • شبکه صریح
  • شبکه ضمنی
  • افزودن ناودان با خاصیت شکاف
  • پروژه - اضافه کردن ستون با Grid

تایپوگرافی

  • تایپوگرافی برای وب
  • تغییر فونت با font-family
  • وزن و سبک قلم
  • فونت‌های وب با @font-face
  • فونت‌های وب با فونت‌های گوگل
  • پروژه - فونت‌های گوگل
  • ویژگی font-size
  • اندازه قلم و قابلیت دسترسی
  • تراز کردن متن و تبدیل متن
  • ارتفاع خطوط و فاصله حروف
  • پروژه - سبک‌های تایپوگرافی
  • پروژه - دکمه‌ها و فاصله

طرح بندی - روان و پاسخگو

  • مقدمه ای بر طراحی واکنش گرا
  • مقدمه ای بر پرسش‌های رسانه ای
  • نقاط انفصال و پرسش‌های رسانه ای
  • چیدمان‌های سیال
  • متا تگ viewport
  • تست طرح‌بندی‌های واکنش‌گرا
  • پروژه - نقاط شکست
  • پروژه - پرسش‌های رسانه‌ای - قسمت 1
  • پروژه - پرسش‌های رسانه‌ای - قسمت 2
  • پروژه - پرسش‌های رسانه‌ای - قسمت 3

نتیجه

  • فراتر از موارد ضروری با CSS ادامه دهید

دوره های مرتبط

مسیرهای مرتبط

درباره ما

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

شماره تلفنکانال آپاراتپشتیبانی تلگرامکانال تلگرامپیج اینستاگرام

کلیه‌ی حقوق این سایت متعلق به لینداکده می باشد

قوانین و شرایط|حریم خصوصی

نماد الکترونیک enamad در صورت اتصال با آی‌پی داخل کشور، نمایش داده خواهد شد.
logo-samandehi - لوگو ساماندهی
zarinpal
zibal