دسته بندی: سی‌اس‌اس CSS

آموزش رفع مشکل Render Blocking CSS

آموزش رفع مشکل Render Blocking CSS

آموزش رفع مشکل Render Blocking CSS Fix Render Blocking CSS درباره خطای Render Blocking CSS و نحوه حل آن Render blocking CSS چیست؟ Render Blocking CSS باعث تاخیر در لود شدن یک وب سایت می شود. هر کدام از فایل های CSS قالب سایت تان، باعث تاخیر در رندر شدن وب سایت می شوند. هرچه […]


افزایش سرعت لود سایت با ادغام تصاویر توسط تکنیک CSS Sprites

افزایش سرعت لود سایت با ادغام تصاویر توسط تکنیک CSS Sprites

ادغام تصاویر توسط تکنیک CSS Sprites Combine images using CSS sprites ترکیب تصاویر با استفاده از روش CSS Sprites   فواید استفاده از تکنیک CSS Sprites چیست؟ فرض کنید شما 6 تصویر در صفحه اصلی سایت تان دارید و مرورگر باید تمام این تصاویر را بطور جداگانه دانلود کند. اگر بتوان این 6 تصویر را […]


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

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

 نحوه فشرده‌سازی فایل‌های CSS و اهمیت آن Minify & Compress CSS فشرده‌سازی (مینی‌فای کردن) فایل‌های CSS فشرده‌سازی CSS (Minifying CSS) چیست؟ همانطور که از نام آن مشخص است، به معنای کوچک سازی فایل های css و فشردن آنها می باشد. از آنجائیکه فایل های css بطور پیش فرض، بصورت render blocking می باشند، ضروریست که […]


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

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

آموزش مدیا کوئری‌ در CSS برای طراحی واکنش‌گرا Introdunction to media queries نحوه تعریف مدیا کوئری (Media Query) در CSS   مدیا کوئری‌ها (Media Queries) دستورالعمل های css می باشند که استفاده از آنها برای طراحی وب سایت ها و وبلاگ های مدرن الزامی می باشد. مدیاکوئری شامل دستوراتی است که در سایزهای مختلف اسکرین […]


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

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

آموزش فریم‌ورک Foundation-بخش10-منو،ویدیو،تصویر بخش دهم: منوی چسبنده (Sticky Navigation)، ویدیوی ریسپانسیو، تصاویر بندانگشتی (Thumbnail) منوی چسبنده، ویدیوی ریسپانسیو، تصاویر بندانگشتی و راست‌چین   در مقاله قبل، المان های جدول، پنل، باکس قیمت و… را بررسی کردیم.   پلاگین Magellan: ممکن است در برخی از پروژه ها نیاز باشد منوی سایت با اسکرول کاربر، در صفحه باقی […]


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

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

آموزش فریم‌ورک Foundation-بخش9-جدول،پنل بخش نهم: جدول، باکس های قیمت، پنل و… المان‌های جدول، پنل، باکس قیمت، پلاگین JoyRide   در بخش قبل، المان‌های progress, alert, tooltip, … در فریم ورک foundation  را معرفی و بررسی کردیم. در این بخش، المان های table ، pricing table و پلاگین Joyride را بررسی می کنیم. پنل ها (Panels): با تعریف […]


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

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

آموزش فریم‌ورک Foundation-بخش8-alert-tooltip بخش هشتم: آموزش المان‌های progress, alert, tooltip, … المان‌های Tooltip، Chart، Progress، Alert در مقاله قبل، نحوه شخصی سازی فرم تماس با را در فریم ورک Foundation آموزش دادیم. در این بخش از آموزش فریم ورک فاندیشن، المان های Progress و Alert و Tooltip را بررسی می کنیم و از آنها در یک […]


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

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

آموزش فریم‌ورک Foundation-بخش7-فرم سفارشی بخش هفتم: فرم های سفارشی (Custom Forms) طراحی فرم‌های سفارشی در فریم‌ورک فاندیشن   در مقاله قبل، المان های دکمه (button) و لیست بازشو (DropDown List) را بررسی کردیم. پس از بررسی و سفارشی سازی دکمه ها در فریم ورک فاندیشن، در ادامه این سری از مقالات، می خواهیم نحوه سفارشی […]


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

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

آموزش فریم‌ورک Foundation-بخش6-دکمه و لیست بازشو بخش ششم: دکمه (Button) و لیست بازشو (DropDown List) دکمه و لیست بازشو در فریم‌ورک Foundation   در مقاله قبل، نحوه سفارشی سازی منوی بالا (Top Bar Customization) در فریم ورک foundation را توضیح دادیم.  در این بخش از آموزش فریم ورک فاندیشن (Foundation Framework) المان های دکمه (Button)، لیست […]


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

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

آموزش فریم‌ورک Foundation-بخش5-سفارشی‌سازی منو بخش پنجم: سفارشی سازی منوی بالا (Top Bar Customization) سفارشی‌سازی منوی بالا در فریم‌ورک فاندیشن   در مقاله قبل، نحوه پیاده‌سازی نوار بالا (TOP BAR) آموزش داده شد. در این مقاله می خواهیم چگونگی سفارشی سازی این المان مهم را آموزش دهیم. فریم ورک فاندیشن، امکانات و ویژگی های خوبی برای […]