توضیحات

دوستان این دوره بازتولید شده (با کیفیت و محتوای بهتر) دوره قبلی (آموزش 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 وات گرین

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

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

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

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