آموزش پروژه شماره 2 وب سایت پاسخگو بسازید: HTML، CSS و جاوا اسکریپت

سرفصل ها و درس ها

معرفی Introduction

• معرفی Introduction

بررسی CSS CSS Review

• ویژگی انیمیشن CSS CSS Animation Property

• ویژگی انتقال CSS CSS Transition Property

• CSS افزودن یک نوع فونت CSS Adding A Type Of Font

• ویژگی خانواده قلم CSS CSS Font Family Property

نحوه ایجاد روکش How To Create An Overlay

• نحوه ایجاد روکش How To Create An Overlay

بررسی طرح Layout Review

• انواع چیدمان Types Of Layouts

• استفاده از درصد به جای پیکسل Using Percentages Instead Of Pixels

مقدمه ای بر بوت استرپ Introduction To Bootstrap

• بوت استرپ چیست What Is Bootstrap

• نصب بوت استرپ Installing Bootstrap

کلاس های بوت استرپ مورد استفاده در این پروژه Bootstrap Classes Used In This Project

• بوت استرپ: کلاس های دکمه ای Bootstrap: Button Classes

• بوت استرپ: کلاس کانتینر Bootstrap: Container Class

• بوت استرپ: کلاس های سیستم شبکه (ستون ها). Bootstrap: Grid System(Columns) Classes

• بوت استرپ: کلاس Text-Center Bootstrap: Text-Center Class

اضافه کردن جاوا اسکریپت Adding The Javascript

• نصب JQuery Installing JQuery

• در حال نصب Snowstorm.js Installing Snowstorm.js

مقدمه ای برای Animate.css Introduction To Animate.css

• Animate.css چیست What Is Animate.css

• نحوه استفاده از Animate.css How To Use Animate.css

ایجاد وب سایت اصلی ما Creating Our Main Website

• افزودن صفحات سبک Adding The Stylesheets

• تنظیم بدنه و فونت چهره ها Setting Up The Body And Font Faces

• راه اندازی کلاس های Btns Setting Up Btns Classes

• راه اندازی کلاس های ورودی Setting Up The Input Classes

• راه اندازی کلاس های سرفصل Setting Up The Heading Classes

• راه اندازی کلاس پاراگراف Setting Up The Paragraph Class

• راه اندازی کلاس های Sectionhead Setting Up The Sectionhead Classes

• بخش اول: اضافه کردن HTML First Section: Adding The HTML

• بخش اول: اضافه کردن CSS First Section: Adding The CSS

• بخش دوم: اضافه کردن HTML Second Section: Adding The HTML

• بخش دوم: اضافه کردن CSS Second Section: Adding The CSS

• بخش سوم: اضافه کردن HTML Third Section: Adding The HTML

• بخش سوم: اضافه کردن CSS Third Section: Adding The CSS

• بخش چهارم: اضافه کردن HTML Fourth Section: Adding The HTML

• بخش چهارم: اضافه کردن CSS Fourth Section: Adding The CSS

• بخش پنجم: اضافه کردن HTML Fifth Section: Adding The HTML

• بخش پنجم: اضافه کردن CSS Fifth Section: Adding The CSS

• بخش ششم: افزودن CSS و HTML Sixth Section: Adding CSS and HTML

• بخش هفتم: اضافه کردن HTML و CSS Seventh Section: Adding HTML and CSS

مقدمه ای بر طراحی واکنشگرا Introduction To Responsive Design

• مقدمه ای بر پرسش های رسانه ای Introduction To Media Queries

• یادداشتی درباره حداقل عرض در پرسش‌های رسانه‌ای A Note On Min-Width In Media Queries

• یک مثال ساده از پرسش های رسانه ای A Simple Example Of Media Queries

• پرسش های رسانه ای: دو مثال دیگر Media Queries: Two More Examples

ریسپانسیو کردن وب سایت ما Making Our Website Responsive

• انتخاب اولین پرسش رسانه Selecting The First Media Query

• اولین پرسش رسانه: افزودن CSS The First Media Query: Adding The CSS

• انتخاب دومین پرسش رسانه Selecting The Second Media Query

• دومین پرسش رسانه: افزودن CSS The Second Media Query: Adding The CSS

• انتخاب سومین پرسش رسانه Selecting The Third Media Query

• سومین پرس و جو رسانه: افزودن CSS The Third Media Query: Adding The CSS

• انتخاب چهارمین پرسش رسانه Selecting The Fourth Media Query

• چهارمین پرسش رسانه: افزودن CSS The Fourth Media Query: Adding The CSS

• انتخاب پنجمین پرسش رسانه Selecting The Fifth Media Query

• پنجمین پرسش رسانه: افزودن CSS The Fifth Media Query: Adding The CSS

• انتخاب The Sixth Media Query Selecting The Sixth Media Query

• پرس و جوی ششم رسانه: افزودن CSS The Sixth Media Query: Adding The CSS

• انتخاب و افزودن پرس و جو رسانه هفتم Picking And Adding Seventh Media Query

نتیجه گیری (کد منبع در سخنرانی) Conclusion(Source Code In Lecture)

• نتیجه Conclusion

سخنرانی پاداش Bonus Lecture

• با تشکر ویژه Special Thanks