جستجو
ثبت نام

اطلاعات ویدیوی آموزشی

آموزش صفر تا صد CSS- آموزش پیشرفته CSS

آموزش پیشرفته CSS

(Cascading Style Sheet)CSS در کنارHTML  هسته فناوری ساخت صفحه‌های وب هستند. به معنی ‌صفحات استایل آبشاری می باشد. چون دستورات  CSS اعمال شده به المان، بر فرزندان آن هم تاثیر دارند.که تنها پیش‌نیاز برای یادگیری مفاهیم CSS، تسلط مناسبی به HTML هست. توسط CSS می‌توانیم تمامی خصوصیات ظاهری صفحه وب‌سایت رو تعیین کنیم.

برای یاد گیری برنامه نویسی در سمت کلاینت در گام اول باید HTML و سپس گام دوم CSS و بعد JavaScript و Jquery را یاد بگیریم. و برای تکمیل یادگیری سمت کلاینت میتوانیم Ajax، Bootstrap، vue.js، React را نیز فرا بگیریم. نه تنها تمامی این موارد در دوره های سایت هوشمندان می باشند بلکه دوره های برنامه نویسی سمت سرور نیز که باید بعد از برنامه نویسی سمت کلاینت یاد گرفت آموزش داده شده اند.

آنچه در دوره پیشرفته CC یاد میگیرید

در این دوره گام دوم که CSS می باشد آموزش داده شده است.

در این دوره :

  • چرا باید زبان CSS را یاد گرفت
  • معرفی Selector ها و اولویت بندی آنها
  • سه نحوه اعمال استایل بر روی یک صفحه وب
  • استفاده از رنگها با نام آن ها، با RGB، با HSL، با کد مبنای 16
  • استفاده از opacity در رنگ بندی
  • انواع استایل دهی به رنگ background، به تصویر background، به border
  • آموزش margin،padding، Box، box-sizing، outline
  • انواع استایل دهی به Text و Font
  • آموزش استفاده از تصاویر FontAwsome
  • انواع استایل دهی به Cursor، به انواع List ها و table ها
  • تفاوت مقدار inline و inline-block در المانها
  • آموزش pseudo-class ها، pseudo-element ها
  • آموزش خصوصیات Position، OverFlow، ElementOverlapping
  • آموزش equal-box-size، container و clearfix
  • آموزش ساخت یک horizontal-navigator
  • ساخت یک page-layout با ترکیب آموزش های داده شده شامل: Header،Container ،footer
  • آموزش transparent-Box، vertical-Navbar، DropDown
  • آموزش ساخت یک horizontal_Navbar که بتواند شاملDropDown باشد
  • آموزش ساخت imageGallery
  • آموزش attributeSelector، formStyling،Search input، counter در CSS
  • آموزش ساخت دو تا از layout های معروف
  • آموزش Unit ها، Specifity، important
  • خصوصیت border-image و background-image ، background-clip بصورت پیشرفته
  • آموزش gradiant، Box Shad، Text-overflow، Word-overflow
  • آموزش Transform ها،Transition ها و animation
  • آموزش ساخت tooltip
  • آموزش نحوه استایل دان به image، ساخت polaroid image و filter ها image
  • آموزش Reflection-image، object-fill،
  • ساخت انواع Button وساخت Pagination
  • آموزش resize-property،
  • آموزش Media-Query، Flex Layout، رسپانسیونویسی
  • آموزش CSS Grid و Sass

 

چرا دوره پیشرفته CSS را انتخاب کنیم:

  • پیش نیاز: HTML به شما توصیه میکنیم دوره پیشرفته HTML را ملاحظه نمایید
  • استفاده از بهترین ویرایشگر زبان CSS
  • استفاده از جدیدترین نسخه CSS (نسخه 5)
  • حفظ روند گام به گام آموزش و رعایت پیش نیازهای لازم برای هر قسمت
  • آموزش کامل استایل های CSS با مثال های متنوع
  • این دوره حاصل ترکیب سه منبع معتبر و اصلی آموزش CSS و تجربیات سالها تدریس و کار برنامه نویسی می­باشد.
  • کسب توانایی لازم برای ایجاد سایت Responsive
  • بعد از این دوره شما تسلط لازم رو بر زبان CSS تا سطح پیشرفته کسب خواهید کرد.

بخش 1:

  • معرفی CSS
  • سلکتورها و کامنت ها در CSS

بخش 2:

  • رنگها و پس زمینه در CSS

بخش 3:

  • استفاده از opacity

بخش 4:

  • انواع استایل دهی به رنگ background
  • انواع استایل دهی به تصویر background
  • انواع استایل دهی به border
  • معرفی margin

بخش 5:

  • آموزش margin
  • آموزش padding
  • آموزش Box
  • اهمیت خصوصیت box-sizing
  • آموزش outline

بخش 6:

  • انواع استایل دهی به Text
  • انواع استایل دهی به Font

بخش 7:

  • آموزش استفاده از تصاویر FontAwsome
  • انواع استایل دهی به Cursor
  • استایل دهی به انواع List ها

بخش 8:

  • استایل دهی به table ها
  • تفاوت مقدار inline و inline-block در المانها

بخش 9:

  • آموزش pseudo-class ها
  • آموزش pseudo-element ها
  • آموزش خصوصیت position

بخش 10:

  • آموزش element overlapping
  • آموزش خصوصیت overflow
  • آموزش تراز کردن یک container در زمانیکه المان از آن overflow می کند
  • (clearfix)
  • آموزش equal-box-size
  • آموزش ساخت یک horizontal-navigator

بخش 11:

  • ساخت یک page-layout با ترکیب آموزش های داده شده شامل:
    • Header
    • Container with 2 column
    • footer

بخش 12:

  • آموزش transparent-Box
  • آموزش vertical-Navbar
  • آموزش ساخت یک DropDown

بخش 13:

  • آموزش ساخت یک horizontal_Navbar که بتواند شاملDropDown باشد
  • آموزش ساخت imageGallery

بخش 14:

  • آموزش attributeSelector
  • آموزش formStyling
  • آموزش ساخت یک Search input
  • آموزش counter در CSS

بخش 15:

  • آموزش ساخت یکی از layout های معروف  شامل: header,topnav,content,footer

بخش 16:

  • آموزش ساخت یکی از layout های دیگر معروف
  • آموزش Unit ها
  • آموزش Specifity
  • آموزش important

بخش 17:

  • آموزش Rounded Corner
  • خصوصیت border-image
  • خصوصیت background-image بصورت پیشرفته

بخش 18:

  • تکمیل خصوصیت پیشرفته background-image
  • خصوصیت background-clip
  • آموزش gradiant

بخش 19:

  • آموزش Box Shadow
  • مدیریت Text-overflow
  • مدیریت Word-overflow
  • آموزش فونت ها و انتخاب بهترین برای web
  • آموزش Transform های دو بعدی

بخش 20:

•           تکمیل آموزش  Transform های دو بعدی

  • آموزش Transition ها
  • آموزش خصوصیت animation

بخش 21:

  • آموزش ساخت tooltip
  • آموزش نحوه استایل دان به image
  • آموزش ساخت polaroid image
  • آموزش filter ها image

بخش 22:

  • آموزش Reflection-image
  • آموزش object-fill
  • آموزش ساخت انواع Button
  • آموزش ساخت Pagination

بخش 23:

  • آموزش resize-property
  • آموزش Media-Query
  • ستونهای چندگانه و رابط کاربری در CSS
  • آموزش Flex Layout

بخش 24:

  • تکمیل آموزش Flex Layout

بخش 25

  • آموزش ساخت یک قالب Responsive با استفاده از viewport، مفهوم GridView و MQ
  • طراحی الگوی یک صفحه با header,footer,unequal column و sideNav
  • رسپانسیو کردن تصاویر و ویدیو ها

بخش 26:

  • آموزش CSS Grid

بخش 27:

  • تکمیل آموزش CSS Grid
  • ساخت یک layout با استفاده از CSS Grid
  • معرفی Sass

بخش 29:

  • Responsive  کردن منو