যদিও <meta name="viewport">ট্যাগ unstandardized, এটা "অ-ফ্যাক্টো আধিপত্য কারণে সবচেয়ে মোবাইল ব্রাউজারে দ্বারা বিবেচনা করা হয়।"
এটির সত্যিকারের ওয়েব স্ট্যান্ডার্ড না হওয়ার একটি দিক হ'ল বিস্তারিত ডকুমেন্টেশন অন্যান্য স্ট্যান্ডার্ডের মতো উপলভ্য নয়। সিএসএস ওয়ার্কিং গ্রুপ যাতে কি আমি প্রধানত একটি প্রামাণিক কাজ হিসাবে ব্যবহার করছি, এই জন্য একটি স্পেসিফিকেশন হয়েছে।
আমার মূল প্রশ্নটি হ'ল:
নিম্নলিখিত ঘোষণার মধ্যে অনুভূত পার্থক্য কি হবে?
<meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="viewport" content="initial-scale=1.0">বিকল্পভাবে জিজ্ঞাসা করা হয়েছে, এই দুটি @ ভিউপোর্ট সিএসএস-এর বিধিগুলির মধ্যে পার্থক্যগুলি কী :
/* Translated from <meta name="viewport" content="width=device-width, initial-scale=1.0"> */
@viewport {
zoom: 1.0;
min-width: extend-to-zoom;
max-width: 100vw;
}/* Translated from <meta name="viewport" content="initial-scale=1.0"> */
@viewport {
zoom: 1.0;
min-width: extend-to-zoom;
max-width: extend-to-zoom;
}এই @viewportঅনুবাদগুলিতে আমি কীভাবে পৌঁছেছি :
width=device-width প্রতি min-width: extend-to-zoom; max-width: 100vw;
সিএসএস ডিভাইস অভিযোজন মডিউল লেভেল 1 ডকুমেন্ট পদ বলে:
widthএবংheightভিউপোর্ট<META>বৈশিষ্ট্য অনুবাদ করা হয়widthএবংheightবর্ণনাকারী, সেটিংmin-width/min-heightমানextend-to-zoomএবংmax-width/max-heightভিউপোর্ট থেকে দৈর্ঘ্যের মান।
তারা অতিরিক্ত একটি উদাহরণ দেয় :
এই
<META>উপাদান:<meta name="viewport" content="width=500, height=600">অনুবাদ:
@viewport { width: extend-to-zoom 500px; height: extend-to-zoom 600px; }
widthসাধারণভাবে সংক্ষেপে বর্ণনাকারী হিসাবে বর্ণনা করা হয়:
এই উভয় সেট করার জন্য একটি সাঁটে লেখার বর্ণনাকারী হয়
min-widthএবংmax-width। একটি<viewport-length>মান উভয়min-widthএবংmax-widthসেই মানকে সেট করে । প্রথমটি এবং দ্বিতীয়টিতে দুটি<viewport-length>মান সেটmin-widthকরা হবেmax-width।
সুতরাং এটি width: extend-to-zoom 500px;সমান যে কারণ দাঁড়ায় min-width: extend-to-zoom; max-width: 500px;।
যে শুধুমাত্র 100vwঅংশ ছেড়ে । বিভাগ 10.4 এর মধ্যে তারা ব্যাখ্যা করে:
device-widthএবংdevice-heightযথাক্রমে 100vw এবং 100vh এ অনুবাদ করুন
সুতরাং আমরা পরিশেষে দেখতে পারি কীভাবে width=device-widthঅনুবাদ করা হয় min-width: extend-to-zoom; max-width: 100vw;।
initial-scale=1.0 প্রতি zoom: 1.0; width: extend-to-zoom;
এটি একটি ভারব্যাটিম উদাহরণ :
এই
<META>উপাদান:<meta name="viewport" content="initial-scale=1.0">অনুবাদ:
@viewport { zoom: 1.0; width: extend-to-zoom; }
অন্যান্য প্রশ্ন আমি এখানে আছে, হয় কি ঠিক হল extend-to-zoomমূল্য কত?
এটা ডকুমেন্টেশন এবং তার রেজল্যুশন পদ্ধতি উপলব্ধি করতে কঠিন। যদি কেউ আমাকে এ সম্পর্কে আরও কয়েকটি উদাহরণের দিকে নির্দেশ করতে পারে তবে তা প্রশংসিত হবে।
উপরের সমস্ত কিছু ছাড়াও, কিছু ভিউপোর্ট কনফিগারেশন পরীক্ষা করার জন্য আমি একটি দ্রুত সাইট - https://romellem.github.io/temp-site/viewport/ - একসাথে রেখেছি ।
যথা:
এটি পরীক্ষায় সহায়তা করতে পারে।
1.0তবে আমি এ সম্পর্কে অনিশ্চিত। যাইহোক, দুর্দান্ত উত্তর, ধন্যবাদ!