62
تشکر

نمای ریسپانسیو در مرورگرها

طراحی رسپانسیو

طراحی رسپانسیو

اگر طراحی ریسپانسیو میکنید. یکی از دغدغه های شما احتمالا درست کردن اندازه مرورگر با اندازه نمایشگرهای مختلف است. برای مثال شما میخواهید ببینید سایت شما در نمایشگرهای 768*1024 چگونه دیده میشود, اینکار با تغییر سایز پنجره مرورگر به درستی انجام نمیشود. البته امروزه سایت هایی هستند که این امکان را به شما میدهند.

اما در این مطلب با ما باشید تا ببینیم مرورگرهای Firefox و Chrome چه امکاناتی را برای ما گذاشته اند.

مرورگر Firefox

در نسخه های جدید این مرورگر امکانی به نام Responsive Design View گذاشته شده است که توسط این گزینه میتوانید سایتتان را در انواع نمایشگر های مختلف ببینید. همچنین این امکان را دارد که خودتان هم اندازه آن را به صورت دستی تعیین کنید.

این امکان از طریق منوی Tools -> Web Developer -> Responsive Design View در دسترس است. همچنین در ویندوز میتوانید مانند عکس زیر این گزینه را فعال کنید.

Responsive in Firefox

Responsive in Firefox

Responsive in Firefox

Responsive in Firefox

مرورگر Chrome

مرورگر Chrome با Developer Tools خود اکثر توسعه دهندگان وب را شیفته خودش کرده است. امکانات مرورگر Chrome واقعا خوب و دارای دسترسی خیلی آسان تری نسبت به فایرفاکس است. همچنین امکان سفارشی سازی هایی را نیز میدهد.

ابتدا وارد قسمت Developer Tools شوید که از طریق فشردن کلید F12 این امکان وجود دارد. سپس کلید F1 بزنید. یک پنجره باز خواهد شد. که با رفتن به منوی Overrides میتوانید در قسمت Device metrics اندازه صفحه نمایش را به صورت دستی تغییر دهید. مانند زیر:

Responsive in Chrome

Responsive in Chrome

شما میتوانید امکانات دیگری را هم در این پنجره مشاهده کنید. اگر تا به حال با Developer Tools مرورگر کروم کار نکرده اید. شاید الان زمان آن فرا رسیده تا به کارهای خودتان سرعت ببخشید.

  • شهرام می‌گه:

    سلام
    با تشکر از شما. مطالب شما خیلی جالب و خواندنی است

  • حمیدرضا مریدی می‌گه:

    سلام خسته نباشی
    ببین به حرف های چرت و پرت توجه نکن
    کارت عالیه و مطالبت درست و دقیق
    من که واقعا استفاده می کنم و کارهام راه میفته
    هرچی میخوای خدا بهت بدون چون و چرا بده

  • آرش می‌گه:

    بابا فارسیش کن ما هم بفهمیم

    • B-T می‌گه:

      منم موافقم!
      جون من این متولد 77 هست اینجوری بلبل زبونی میکنه؟؟؟
      الان احساس کمبود شدیدی کردم
      😀

  • گلاره می‌گه:

    سلام.من تازه کار طراحی وب سایتو شروع کردم اما از همین حالا میخوام سایتایی که بعدا میخوام بسازم ریسپانسیو باشن.یه منبع فارسی که ب طور کامل همه چیو در مورد این مبحث توضیح داده باشه سراغ ندارین؟

  • tormahiri77 می‌گه:

    can you load data from server side programming language php to client-side ?
    if you will do that i so excited for this work
    thanks man

  • tormahiri77 می‌گه:

    thanks man,i looking forward more tutorial thanks keep it your work is amazing god bless you
    i have one question
    can you touturial about android and mobile appliaction?


  • نظرات این مطلب بسته است.