প্রতিক্রিয়াশীল ওয়েব ডিজাইন মোবাইল ডিভাইসে নয় ডেস্কটপে কাজ করছে


117

আমার কাছে একটি ওয়েবসাইট রয়েছে যা অবশ্যই মোবাইল ফোনের জন্য প্রতিক্রিয়াশীল। আমি আমার ডেস্কটপ ব্যবহার করে এটি তৈরি করেছি। আমি যখন ব্রাউজার উইন্ডোজগুলি মোবাইল ফোনের জন্য নিখুঁতভাবে কাজ করে তা সামঞ্জস্য করি তবে যখন আমি আমার আসল মোবাইল ফোনে এটি পরীক্ষা করি: স্যামসাং গ্যালাক্সি এস 2 এটি মোবাইল দর্শনের জন্য প্রতিক্রিয়াশীল নয়।

ভুল কী হতে পারে?


1
যে কারও সহায়ক হওয়ার জন্য আপনাকে আরও তথ্য এবং কোড যুক্ত করতে চলেছেন। আপনার সিএসএস, এইচটিএমএল ইত্যাদি আপনি কী ফ্রেমওয়ার্ক (যেমন টুইটার বুটস্ট্র্যাপ) ব্যবহার করছেন, যদি থাকে তবে ইত্যাদি
ajacian81

উত্তর:


306

আপনি সম্ভবত এইচটিএমএল হেডে ভিউপোর্টের মেটা ট্যাগটি অনুপস্থিত:

 <meta name="viewport" content="width=device-width, initial-scale=1">

এটি ছাড়াই ডিভাইসটি ভিউপোর্টটি পুরো আকারে ধার্য করে এবং সেট করে।

আরও তথ্য এখানে


2
এটি এই লাইনটি ছাড়া ব্রাউজারে কাজ করতে পারে তবে মোবাইলে কেবল এই লাইনের প্রয়োজন needs
তাদাস ডেভিডসনাস

3
আমি কেবল
তোমাকেই


আপনাকে ভালবাসার আর একটি কথা
বিটিএলএম

3
প্রোডাকশনটিতে index.htmlট্যাগের পাশাপাশি উন্নয়নের অন্তর্ভুক্ত রয়েছে তা নিশ্চিত করুনindex.html
হালফি

6

আমিও এই সমস্যার মুখোমুখি হয়েছি। অবশেষে আমি একটি সমাধান পেয়েছি। এই বেলো কোডটি ব্যবহার করুন। আশা: সমস্যা সমাধান হবে।

<meta name="viewport" content="initial-scale=1, maximum-scale=1">


2

যদিও এটি উপরে উত্তর দেওয়া হয়েছে এবং এটি ব্যবহার করা ঠিক

<meta name="viewport" content="width=device-width, initial-scale=1">

তবে আপনি যদি প্রতিক্রিয়া এবং ওয়েবপ্যাক ব্যবহার করছেন তবে উপাদান ট্যাগটি বন্ধ করতে ভুলবেন না

<meta name="viewport" content="width=device-width, initial-scale=1" />

-1

প্রতিক্রিয়াশীল মেটা ট্যাগ

সমস্ত ডিভাইসের যথাযথ রেন্ডারিং এবং স্পর্শ জুমিংয়ের জন্য, আপনার কাছে প্রতিক্রিয়াশীল ভিউপোর্ট মেটা ট্যাগ যুক্ত করুন <head>

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.