دوره جامع آموزش CSS

آخرین بروزرسانی دوره 25/بهمن/1400

مقدمه

بعد از دوره جامع و پروژه محور HTML نوبت به برداشتن گام دوم در جهت افزودن مهارت برنامه نویسی میرسد در دوره html ما به طور کامل آموختیم که چگونه میشود یک قالب و اسکلت وب سایت را پیاده سازی کرد حال نوبت به این میرسد که به این اسکلت بندی یک رنگ و لعاب هم بدهیم که از حالت ساده بودن و بی روح بودن در بیاد و تبدیل به یک قالب شکیل و کاربر پسند شود که تمامی این کار ها بر عهده CSS است و دقیقا هدف ما در این دوره همین است که با استفاده از html و Css و ترکیب این دو با هم طرح های بسیار زیبا و شکیلی را پیاده سازی کنیم.

پیشنیار دوره

دوره جامع آموزش HTML

پیشنهاد ما برای دوره های بعدی

دوره جامع Emmet

آموزش صفر تا صد Flex box

دوره HTML و CSS پیشرفته

CSS چیست ؟

در ابتدا باید بدانید که Css مخفف چیست؟  سی اس اس  در لغت مخفف Cascading Style Sheet (CSS) است. زبان css یک زبان طراحی صفحات وب برای استایل دهی و زیبا کردن تگ های html می باشد. هدف از ایجاد css در واقع جداسازی اطلاعات محتوا (که توسط زبانی مانند HTML نوشته شده اند) از اطلاعات ظاهری مانند صفحه بندی، رنگ و سایز و نوع فونت می باشد. این جداسازی موجب افزایش سرعت در دسترسی به سایت، انعطاف پذیری بیشتر برای کنترل ویژگی های ظاهری، قابلیت طراحی چندین صفحه با یک فرمت یکسان و جلوگیری از پیچیدگی و انجام کارهای تکراری در طراحی وب سایت می گردد.

از دیگر کاربرد css این است که می توان تنظیماتی را اعمال نمود که نمایش صفحه وب سایت مورد نظر بسته به اندازه صفحه نمایش کاربر متغیر باشد که به آن اصطلاحا طراحی واکنشگرا می گویند. در صورتی که مدیر وب سایت چندین نوع نمایش را برای یک صفحه وب سایت خود تنظیم نموده باشد،  css برای تصمیم گیری اینکه کدام حالت را به نمایش بگذارد، از ابزارهای تعیین اولویت استفاده می نماید.

در این دوره تمامی مباحث CSS پوشش داده شده و بعد از گذراندن این دوره احتیاجی به هیچ منبع دیگر ندارید و همین طور برای تثبیت مباحث برای شما در فصل آخر این دوره 6 پروژه بسیار مهم را تنها با دانش html و css خود که تا اکنون یادگرفتیم پیاده سازی میکنیم که 5 پروژه آن از نوع پروژه های گرافیکی است که بسیار پروژه های جذابی است و در نهایت هم یک پروژه به عنوان یک تک صفحه را با html و css پیاده سازی میکنیم و دهمین طور عملیات واکنشگرایی هم به صورت کامل بر روی آن اعمال میکنیم. پس با ما همراه باشید...

فهرست سرفصل‌های این دوره آموزشی ، در ادامه آمده است 

• فصل یکم : شروع کار با CSS
• معرفی انواع روش های پیاده سازی CSS
• فصل دوم : بررسی attributeهای id و class
• فصل سوم :کار با انتخابگرها (Selectors)
• انتخابگرهای ساده
• ترکیب انتخابگرها
• فصل چهارم : کامنت گذاری در CSS
• فصل پنجم : رنگ ها در CSS
• رنگ های rgb & rgba
• رنگ های HEX
• رنگ های hsl & hsla
• فصل ششم :کار با بک گراندها در CSS
• فصل هفتم : کار با حاشیه ها در CSS
• بررسی کامل border ها
• بررسی کاملborder-radius ها
• فصل هشتم : استفاده فاصله ها در CSS
• کار با margin در CSS
• کار با padding در CSS
• فصل نهم : آموزش استایل دهی در text ها
• فصل دهم : ليست‌ها در CSS
• نحوه نمايش ليست‌ها
• فصل یازدهم : اعمال فونت ها در CSS
• فصل دوازدهم : اعمال استایل دهی در لینک ها
• معرفی hover event در CSS
• معرفی active event در CSS
• فصل سیزدهم : لیست ها و نحوه استایل دهی به آنها
• فصل چهاردهم : جداول در CSS
• استایل دهی به جداول و پیاده سازی یک تمرین
• فصل پانزدهم : اعمال display ها در CSS
• فصل شانزدهم : اعمال position ها در CSS
• فصل هفدهم : z-index در CSS
• فصل هجدهم : overflow در CSS
• فصل نوزدهم : navigation bar & dropdown در CSS
• فصل بیستم : important در CSS
• فصل بیست و یکم : کار با ( )calc در CSS
• فصل بیست و دوم : gradient ها در CSS
• فصل بیست و دوم : shadow در CSS
• فصل بیست و سوم : transform در CSS
• فصل بیست و چهارم : transition & animation در CSS
• فصل بیست و پنجم : flexbox در CSS
• فصل بیست و ششم : واکنشگرایی قالب ها در CSS
• فصل بیست و هفتم : کار با فیلتر تصاویر - کار با متغیر ها در CSS 
• فصل بیست و هشتم : استایل دهی به فرم ها - tooltip ها در CSS
• فصل بیست و نهم : فصل پروژه های دوره
• پروژه اول : پروژه گرافیکی ترکیب تصاویر
• پروژه دوم : پروژه گرافیکی حدس تصویر
• پروژه سوم : پروژه گرافیکی شبیه سازی اتصالی برق
• پروژه چهارم : پروژه ساخت لودینگ گرافیکی
• پروژه پنجم : پروژه checkbox گرافیکی
• پروژه ششم : پروژه تک صفحه ای وب سایت برنامه نویسی

نرم افزار های این دوره را میتوانید از لینک زیر دانلود کنید

نرم افزار phpstorm2021