آموزش Materialize CSS

معرفی Introduction

• طراحی مادی و پاسخگو Materialize and responsive design

1. تنظیم محیط 1. Environment Setup

• مادیت کردن نمای کلی CSS Materialize CSS overview

• Materialize: نصب محلی Materialize: Local installation

• تحقق: راه اندازی CDN Materialize: CDN setup

2. رنگ های CSS را متریال کنید 2. Materialize CSS Colors

• متریال سازی: کلاس های رنگ Materialize: Color classes

• متریال کردن: استفاده از رنگ Materialize: Color usage

3. متریال کردن سیستم شبکه 3. Materialize Grid System

• نمای کلی سیستم شبکه Grid system overview

• ردیف ها و ستون های سیستم شبکه ای Grid system rows and columns

• چالش: طراحی شبکه پاسخگو Challenge: Responsive grid design

• راه حل: طراحی شبکه پاسخگو Solution: Responsive grid design

4. Navbar و Pagination را متریال کنید 4. Materialize Navbar and Pagination

• نوارهای ناوبری برای طراحی دسکتاپ و موبایل Navbars for desktop and mobile design

• صفحه بندی Pagination

• Preloaders Preloaders

• ابزارهای کمکی یا کمکی را مادی کنید Materialize utilities, or helpers

5. مادی کردن رسانه 5. Materialize Media

• کلاس های تصویری و ویدئویی واکنش گرا Responsive image and video classes

• سایه ها و عمق z Shadows and z-depth

• جداول Tables

• تایپوگرافی و قالب بندی متن Typography and text formatting

6. دکمه ها و مدالها را تحسین کنید 6. Materialize Buttons and Badges

• دکمه ها Buttons

• پودرهای سوخاری Breadcrumbs

• نشان ها Badges

• کلاس های کارت و استفاده Card classes and usage

• چالش: یک طرح ایجاد کنید Challenge: Create a layout

• راه حل: طرح بندی احتمالی را با استفاده از کارت ها مرور کنید Solution: Review a possible layout using cards

7. Form and Footer را متریال کنید 7. Materialize Form and Footer

• تشکیل می دهد Forms

• پاورقی ها Footers

• استفاده از ابزارها در پروژه نهایی Applying tools to a final project