سی‌اس‌اس CSS

آموزش کامل پیش‌پردازنده LESS

آموزش کامل پیش‌پردازنده LESS

آموزش کامل پیش‌پردازنده LESS » در این مقاله ، زبان شیوه نامه LESS را معرفی کرده و کار با برنامه winless و فایل less.min.js و mixin ها را آموزش می دهیم.

آموزش Sass – نصب، تعریف متغیر، عملگر، پارشیال و میکسین

آموزش Sass – نصب، تعریف متغیر، عملگر، پارشیال و میکسین

آموزش Sass - نصب، تعریف متغیر، عملگر، پارشیال و میکسین » در این مقاله، SASS را معرفی کرده و تعریف متغیر، عملگر، تو در تو نویسی، ارث بری، میکسین را می گوییم

مثال‌های SASS و کامپایل آن به CSS – بخش اول

مثال‌های SASS و کامپایل آن به CSS – بخش اول

مثال‌های SASS و کامپایل آن به CSS - بخش اول » در این مقاله، 29 مثال کاربردی از SASS را بررسی خواهیم کرد. مانند: تودرتو نویسی، import کردن، پارشیال ها و...

مثال‌های SASS و کامپایل آن به CSS – بخش دوم

مثال‌های SASS و کامپایل آن به CSS – بخش دوم

مثال‌های SASS و کامپایل آن به CSS - بخش دوم » مثال هایی از زبان sass در زمینه extend ، at-root ، دستور شرطی if و حلقه های شرطی while و... خواهیم دید.

آموزش Flexbox در طراحی سایت

آموزش Flexbox در طراحی سایت

آموزش Flexbox در طراحی سایت : در این مقاله آموزشی، خاصیت FlexBox را در css برای طراحی قالب وب سایت آموزش می دهیم. معرفی خاصیت FlexBox و فواید آن، تبدیل ستون به Flexbox Container، تبدیل باکس خبر به Flex Container، افزودن چند ستون تو در تو و طراحی واکنش‌گرا توسط FlexBox.

۲۰ تکنیک برای نوشتن کدهای CSS پیشرفته

۲۰ تکنیک برای نوشتن کدهای CSS پیشرفته

20 تکنیک برای نوشتن کدهای CSS پیشرفته : در این مقاله، تکنیک هایی برای نوشتن پیشرفته CSS را آموزش می دهیم. مانند: استفاده از Flexbox، CSS reset، خاصیت border-box، خاصیت border-collapse، ایجاد انیمیشن css توسط transform، کدهای فشرده CSS (Minified)، استفاده از وب سایت Caniuse.com و غیره...

معرفی بهترین فریم‌ورک‌های متریال دیزاین

معرفی بهترین فریم‌ورک‌های متریال دیزاین

معرفی بهترین فریم‌ورک‌های متریال دیزاین » در این مقاله آموزشی، 16 کتابخانه و فریم ورک برای طراحی متریال را معرفی می کنیم. مانند: foundation، Material Design Lite، Materialize، Material-UI، MUI CSS، Polymer، Ionic Material، Material Foundation، Surface، Essence، Angular Material و غیره

آموزش فریم‌ورک Foundation-بخش۱-معرفی و مقدمه

آموزش فریم‌ورک Foundation-بخش۱-معرفی و مقدمه

آموزش فریم‌ورک Foundation-بخش1-معرفی و مقدمه » در این مقاله، فریم ورک فاندیشن foundation را معرفی می کنیم و نحوه دانلود و شروع کار را خواهیم آموخت. همچنین ویژگی‌های اختصاصی فریم‌ورک فاندیشن را بیان کرده و وب سایت های معتبر و معروفی که از این فریم ورک بهره برده اند را معرفی می کنیم.

آموزش فریم‌ورک Foundation-بخش۲-سیستم گرید

آموزش فریم‌ورک Foundation-بخش۲-سیستم گرید

آموزش فریم‌ورک Foundation-بخش2-سیستم گرید » آموزش سیستم گرید فریم ورک فاندیشن (Foundation grid system) بهمراه معرفی پلاگین اسلایدر اوربیت orbit

آموزش فریم‌ورک Foundation-بخش۳-منو Navigation

آموزش فریم‌ورک Foundation-بخش۳-منو Navigation

آموزش فریم‌ورک Foundation-بخش3-منو Navigation » در این مقاله پلاگین section ، منوی کناری side nav ، زیر منو sub nav را بررسی خواهیم کرد. همچنین اتریبیوت data-section، لینک‌دهی عمقی (Deep Linking)، Sub Nav در فریم ورک فاندیشن، صفحه بندی (Pagination) و نکات صفحه‌بندی در المان pagination را بررسی می کنیم

آموزش فریم‌ورک Foundation-بخش۴-نوار بالا top bar

آموزش فریم‌ورک Foundation-بخش۴-نوار بالا top bar

آموزش فریم‌ورک Foundation-بخش4-نوار بالا top bar » در این مقاله، منوی واقع در نوار بالا (top bar) را بررسی می کنیم و مثال های کاربردی را بیان می کنیم. سرفصلها: افزودن لینک های والد (Adding Parent Links)، افزودن زیرمنو (Adding Submenu)، افزودن باکس جستجو (Adding Search Input) و...

آموزش فریم‌ورک Foundation-بخش۵-سفارشی‌سازی منو

آموزش فریم‌ورک Foundation-بخش۵-سفارشی‌سازی منو

آموزش فریم‌ورک Foundation-بخش5-سفارشی‌سازی منو » نحوه شخصی سازی منوی افقی اصلی (Top Bar Customization) را آموزش می دهیم. شامل تعریف کدهای HTML و CSS دلخواه برای منو و نشانه‌گذاری نوار بالا (Top bar markup) و تنظیمات مدیا کوئری (Setting up the Media Query) و...

آموزش فریم‌ورک Foundation-بخش۶-دکمه و لیست بازشو

آموزش فریم‌ورک Foundation-بخش۶-دکمه و لیست بازشو

آموزش فریم‌ورک Foundation-بخش6-دکمه و لیست بازشو » در این مقاله آموزشی، المان های دکمه و گروه دکمه‌ها (button groups)، نوارهای دکمه (Button Bars)، لیست بازشو و پلاگین clearing را بررسی می کنیم.

آموزش فریم‌ورک Foundation-بخش۷-فرم سفارشی

آموزش فریم‌ورک Foundation-بخش۷-فرم سفارشی

آموزش فریم‌ورک Foundation-بخش7-فرم سفارشی » در این مقاله، طراحی فرم‌های سفارشی در فریم‌ورک فاندیشن و نیز نحوه سفارشی کردن فرم تماس را آموزش می دهیم.

آموزش فریم‌ورک Foundation-بخش۸-alert-tooltip

آموزش فریم‌ورک Foundation-بخش۸-alert-tooltip

آموزش فریم‌ورک Foundation-بخش8-alert-tooltip » در این مقاله، المان های alert و progress و chart.js و tooltip و ریست کردن فرم را در فاندیشن آموزش می دهیم.

آموزش فریم‌ورک Foundation-بخش۹-جدول،پنل

آموزش فریم‌ورک Foundation-بخش۹-جدول،پنل

آموزش فریم‌ورک Foundation-بخش9-جدول،پنل » در این مقاله، المان های جدول (table)، پنل (panel)، جدول قیمت (Price Tables) و پلاگین Joyride را معرفی می کنیم.

آموزش فریم‌ورک Foundation-بخش۱۰-منو،ویدیو،تصویر

آموزش فریم‌ورک Foundation-بخش۱۰-منو،ویدیو،تصویر

آموزش فریم‌ورک Foundation-بخش10-منو،ویدیو،تصویر » در این مقاله، منوی چسبنده (sticky navigation)، ویدیوی ریسپانسیو، تصاویر بندانگشتی و... را آموزش می دهیم.

آموزش مدیا کوئری‌ در CSS برای طراحی واکنش‌گرا

آموزش مدیا کوئری‌ در CSS برای طراحی واکنش‌گرا

آموزش مدیا کوئری‌ در CSS برای طراحی واکنش‌گرا » در این مقاله، مدیا کوئری ها را معرفی کرده و نحوه استفاده از آنها را در یک سایت ریسپانسیو بیان می کنیم.

نحوه فشرده‌سازی فایل‌های CSS و اهمیت آن

نحوه فشرده‌سازی فایل‌های CSS و اهمیت آن

نحوه فشرده‌سازی فایل‌های CSS و اهمیت آن » در این مقاله، دلایل فشرده سازی و کوچک کردن فایل های CSS و نیز روش های فشرده کردن فایل CSS را آموزش می دهیم.

ترتیب استایل‌های CSS و اسکریپت‌های JS

ترتیب استایل‌های CSS و اسکریپت‌های JS

ترتیب استایل‌های CSS و اسکریپت‌های JS » در این مقاله، ترتیب استایل های css و اسکریپت های javascript را بیان می کنیم و دلیل اهمیت ترتیب آنها را می گوییم.