توضیحات

دوستان این دوره بازتولید شده (با کیفیت و محتوای بهتر) دوره قبلی (آموزش HTML۵ & CSS۳ پروژه محور) در سایت هست که میتوانید از این دوره استفاده کنید.

HTML  (اچ تی ام ال) برگرفته از حروف اول عبارت HyperTextMarkupLanguage می باشد و به عنوان یک زبان نشانه گذاری متن ( زبان استاندارد صفحات وب ) می باشد. معمولا در یک صفحه ی موجود بر روی وب مجموعه ای از متن ها، عکس ها، بخش بندی های مختلف وجود دارد، به کمک تگ ها و کدهایی که HTML در اختیارتان قرار می دهد، می توانید یک ساختار مشخص از اطلاعات را در این قسمت ها  به وجود آورید و در معرض نمایش بازدیدکنندگان قرار بدهید. 

Css (سی اس اس) کوتاه شده یا مخفف عبارت Cascading Style Sheets می باشد که قابلیت صفحه آرایی؛ استایل دهی و زیبا سازی صفحات وب را برای طراحان سایت فراهم می سازد. در واقع ساختار یک صفحه با استفاده از HTML تعیین می شود و سپس با به کار بردن کدهایی دیگر به این ساختار و چیدمان استایل داده می شود. تمامی رنگ ها، ابعاد و اندازه ها، حاشیه ها، مکان قرارگیری، فونت ها و سایر خصوصیات اجزای یک صفحه ی وب، با استفاده از CSS تعیین خواهند شد.
حتما ویدیو معرفی دوره را در پایین مشاهده کنید تا با دوره و پروژه ای انتهای دوره آشنا شوید.

مباحثی که در این دوره گفته میشود شامل :
آشنایی با HTML (اچ تی ام ال)

  • معرفی HTML
  • ابزار های مورد نیاز
  • ساخت اولین صفحه با HTML
  • بررسی ساحتار HTML
  • تگ های paragraph و heading و img
  • تگ های link و strong و em و list
  • تگ های form و table

آشنایی با CSS (سی اس اس)

  • معرفی CSS (سی اس اس)
  • ترتیب اجرای css
  • selector ها در css
  • تگ های span و div
  • ارث بری در css
  • ترکیب selector ها

رنگ ها (colors) در css

  • پراپرتی background-color
  • رنگ ها در css

واحد ها (units) در css

  • واحد های pixel و percent و em و rem
  • واحد های vw و vh
  • استایل های پیش فرض و ابزار devtools در مرورگر
  • تابع ()calc
  • پراپرتی hight و width

تایپوگرافی (typography) در css

  • پراپرتی font-family
  • افزودن فونت به css
  • پراپرتی های دیگر فونت

box model در css

  • پراپرتی padding و margin و border
  • پراپرتی outline
  • box-sizing

نمایش (display) در css

  • پراپرتی display
  • مقدار inline-box
  • پراپرتی های دیگر display

تصویر پس زمینه (background image) در css

  • پراپرتی background-image
  • linear gradient
  • background image overlay

موقعیت (position) و float در css

  • پراپرتی float
  • پراپرتی های position
  • پراپرتی z-index

رسپانسیو (media query) در css

  • آشنایی با رسپانسیو (responsive)
  • دستور media query
  • طراحی mobile-first

pseudo-element و pseudo-class در css

  • آشنایی با pseudo-element
  • آشنایی با pseudo-class

transform و transition و animation در css

  • پراپرتی transform
  • پراپرتی transition
  • پراپرتی animation

مباحث تکمیلی در css

  • متغیر در css
  • آیکون (icon)
  • پراپرتی text-shadow و body-shadow
  • مبحث browser prefix
  • مبحث smantic HTML
  • پراپرتی object-fit

ایجاد پروژه نهایی و آپلود پروژه روی سرور (deploy)

دوره های پیشنهادی، بعد از گذراندن این دوره :


HTML CSS طراحی وب طراحی سایت سی اس اس اچ تی ام ال css 3 html 5

مدرس دوره علی شیخ
مدت دوره 13:47:11
تعداد ویدیو 86

وضعیت دوره : کامل شده
قیمت دوره : رایگان

نظرات ارزشمند شما:

برای ارسال نظر ابتدا باید وارد سایت شوید

  • سلام جناب شیخ دوره شما واقعا عالی هست و بسیار عالی و ساده بیان میکنید. من که دوره آموزشگاهی فرانت شروع کردم در کنارش دوره شمارو هم دارم میبینم و واقعا مکمل هم هستند.ممنون ❤️❤️❤️❤️

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون
      خداروشکر دوره براتون مفید بوده

  • سلام وقت بخیر
    استاد عزیز امکانش هست یک میانگین زمانی(روزی چند ساعت ...) همراه با فهرست فصل های موجود در سایت برای یادگیری فرانت وب لطف کنید؟ بنده دوره ها و پروژه های شمارو چندین بار تمرین می کنم و مطالب بسیار زیادی یاد میگیرم، اما برام سوال شد که من با گذر از چه مسیری میتونم فرانت کار کنم.
    ممنون.

    • سلام وقت بخیر.
      مسیر یادگیری در بخش چارت آموزشی هست و مدت زمان موضوعی هست که کاملا به شما بستگی داره که هر دوره را تا چه مدت میتونید تمرین و کار کنید
      خیلی ها یک دوره را فقط بصورت فیلم نگاه میکنند و نه تمرین میکنند و نه دست به کیبورد میشند و خیلی ها هم تا پروژه انتهایی دوره را خودشون پیاده سازی نکنند سراغ دوره بعدش نمیرند و بلعکس کلا این موضوع بستگی به نحوه کار شما و مدت زمانی که وقت میگذارید داره و دنیای وب دنیایی بزرگی هست که نیاز به تمرین و کار داره نه صرف با دیدن فیلم

  • سلام در بسیاری از بخش های آموزشی شما به سرعت کدها را بین فایل ها کپی پیس می کردید بدون اینکه ابتدا اون کد ها را انتخاب کنید یعنی اول کنترل +سی و بعد کنترل +وی ... از این لحاظ این سوال را پرسیدم که اگر مهارت یا ترفند خاصی جهت این کار دارید که به سرعت بتوانیم کد ها را کپی پیست نمائیم ،بفرمائید.

    • سلام وقت بخیر.
      خیلی دقیق متوجه سوالتون نشدم اما من همیشه میگم با ابزار کارتون آشنا باشید مثلا shortcut های که vscode داره و با یه سرچ ساده میتوانید آشنا بشید.

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون🙏
      خداروشکر دوره براتون مفید بوده

  • درود.
    جاداره که از شما بدلیل تولید همچین دوره با کیفیت و با توضیح روونی تشکر کنم
    من قبلا html و css رو از منابع دیگه یاد گرفته بودم ولی یادگیری عمیق نبود. این دوره علاوه بر اینکه بسیار خوب و کاربردی توضیح داده، ترتیب یادگیری مناسبی هم داره و هر مبحثی رو در زمان مناسب یاد داده.
    مطمئن باشید که هر زمان با فردی علاقه مند به طراحی وب سایت مواجه شدم، اول از همه شما و سایتتون رو بهش معرفی میکنم.
    با تشکر.

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون🙏
      خداروشکر دوره براتون مفید بوده

  • ممنون بابت تمام زحمات شما
    داداش لطفا بهم کمک کن من سیستم اینا نداشتم تو عمرم الانم ندارم ولی علاقه شدیدی دارم به برنامه نویس شدن دارم با گوشی تمرین میکنم واقعا سخته با گوشی یک دوست بهم پیشنهاد داد آیا سیستم زیر توانایی اجرای vs code و... بدون لگ هنگی برای فرانت اند را دارد

    1- Core i3- 3220 CPU

    2-مادربرد اینتل H61

    3-رم کامپیوتر کینگستچن تک کاناله 8گیگابایت

    4-کارت گرافیک استوک ایکس اف‌ ایکس rx 580 ddr5

    5-هارد دیسک اینترنال wd 500 گیگ

    مدل Blue WD 5000 LPCx

    6-حافظه اس اسددی لگسار مدل ns100 -128 گیگ

    7- پاور کامپیوتر. 430 وات گرین

    همینو واسم فرستاد لطفا بهم بگو داداش بازم دمت گرم

    • سلام وقت بخیر.
      خیلی عذرخواهی میکنم تخصص بنده نیست
      اما کلا برنامه نویسی نیاز به سخت افزار خیلی قوی نداره
      بازم از فروشندگان لپ تاپ یا کامپیوتری ها سوال کنید اونا بیشتر میتونند کمک کنند.

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

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون
      خداروشکر دوره براتون مفید بوده

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

    • سلام وقت بخیر.
      مممون از شما و حمایتتون
      به اینصورت نیست که قسمتی آپدیت شده باشه و کلا دوره باز تولید شده

  • واقعا مرسی
    نمیدونم چجوری توصیف کنم که چقدر خوب توضیح میدادی اما من به شدت با طرز آموزشت حال کردم واقعا این دوره حتی ارزش خریدن هم داشت خیلی کیف کردم اصلا خسته نشدم از نگاه کردن انشاالله رسیدم دوره های بعدی حتما واسه حمایتت میخرمشون دمت گرم ♥♥

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون
      خداروشکر دوره براتون مفید بوده

  • سلام استاد ممنون از اموزش های بینظیر شما
    من در حال اموزش دوره های html.css هستم و اینکه من در ر
    طول روز چطور تمرین کنم و بهتر یاد بگیرم اموزشها رو ک میبینم نمیتونم به تنهایی تمرین کنم به چه صورت کار کم؟

    • سلام وقت بخیر.
      ممنون از شما، هر جلسه را مشاهده کنید و همون موضوعات را شما هم کد بزنید و هر ویدیوی که نیاز بود را دوبار ببینید و سوالی دارید حتما اول سعی کنید با سرچ بهش برسید (این خیلی کمک میکنه) و در نهایت پروژه نهایی دوره را بعد از دیدن و تمرین، سعی کنید خودتون یکبار کامل پیاده سازی کنید.

  • درود استاد
    من تو مباحثی ضعف داشتم که به سایت شما برخوردم و برام راهگشا بود ممنونم خیلی خوبه که ویدیوها مبحث به مبحث و کوتاه هست خسته نباشید

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون
      خداروشکر دوره براتون مفید بوده