ساخت یک طراحی تک صفحه ای واکنش گرا با Sass

مدرس Ray Villalobos

انتشار 2014/09/23

مدت زمان 4h 55m

سطح پیشرفته

فایل تمرینی دارد

آموزش Building a Responsive Single-Page Design with Sass

با نحوه ساخت طرح های تک صفحه ای پویا و پاسخگو با HTML، جاوا اسکریپت و CSS آشنا شوید. وب‌سایتی که در این دوره ارائه می‌شود، ناوبری اتصال، ستون‌هایی را که بدون درهم ریختن طرح‌بندی سایت شما تنظیم می‌شوند یا نشانه‌گذاری HTML، و افکت‌های پیمایش متحرک که به جهت کاربر پاسخ می‌دهند، ترکیب می‌کند. نویسنده Ray Villalobos به شما نشان می دهد که چگونه آن را بسازید. او با یک الگوی ساده و آسان شروع می‌کند و سپس توضیح می‌دهد که چگونه می‌توان ویژگی‌هایی را که طراحی‌های تک صفحه‌ای را بسیار عالی می‌کنند، با این چهار چارچوب اضافه کرد:rn این یک پروژه واقع گرایانه است که تجسم بسیاری از چالش های طراحی است که توسعه دهندگان وب سایت در دنیای واقعی با آن روبرو هستند. همین حالا تماشا را شروع کنید و یاد بگیرید که چگونه از HTML، jQuery و CSS برای ایجاد طرح‌های پویا و عمیق پاسخگوی خود استفاده کنید.

Responsive Web Design SASS Single Page Applications

Introduction

Welcome ()

What you should know before watching this course ()

Using the exercise files ()

1. Getting Started

Analyzing our project ()

Installing Git and Node on a Mac ()

Installing Git and Node on a PC ()

Installing and updating Ruby ()

Downloading dependencies ()

Analyzing our workflow ()

Examining your HTML ()

2. Organizing Your Sass

Working with Github templates ()

Organizing your Sass ()

Preparing your variables ()

Creating basic styles ()

Building your own mixins ()

Preparing your header ()

Coding the navigation ()

3. Creating Responsive Grids with Susy

Making your navigation responsive ()

Controlling media queries with Breakpoint ()

Using the Susy Gallery mixin ()

Designing a complex layout ()

Adjusting your layouts ()

Padding elements with Susy ()

Using jQuery for full screen and Compass flexbox features ()

Creating media queries outside your elements ()

Adding defaults to your background mixing ()

Using a split layout ()

Finishing your layouts ()

Adding a footer ()

4. Animating Your Layouts

Creating a tween animation ()

Pinning your navigation and smoothing scrolling ()

Highlighting menu items on scroll ()

Controlling scenes by scrolling ()

Adjusting for touch devices ()

Deploying to production ()

Conclusion

Next steps ()

Ex_Files_Resp_Single_Page.zip (9.7 MB)

دانلود فایل فشرده

با توجه به امکانات آموزش و همچنین امکانات بسته انتخاب شده لینک دانلود فایل فشرده آماده خواهد شد. با در نظر داشتن این شرایط لطفا بسته مورد نظر خود را انتخاب کرده و روی دکمه درخواست لینک دانلود کلیک کنید

در حال به روزرسانی اطلاعات

درخواست لینک دانلود

در حال به روزرسانی اطلاعات

لطفا قبل از فعالسازی لینک دانلود به موارد زیر توجه کنید:

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