প্রতিক্রিয়াশীল ডিজাইন সাধারণত কোনও প্রস্থ বা উচ্চতার বৈশিষ্ট্য ব্যবহার করে না
গুগল বিকাশ সরঞ্জামগুলি গাইড এবং আপনার সাইটে আপনার পড়া সমস্ত কিছুই প্রয়োগ করার দরকার নেই, আসলে কিছু জিনিস পুরানো। বেশিরভাগ প্রতিক্রিয়াশীল ওয়েবসাইটগুলি ব্যবহার করে না width
বা height
কারণ তারা চিত্রগুলি পর্দার আকারের সাথে খাপ খাইয়ে নিতে চায় এবং নির্দিষ্ট প্রস্থ এবং উচ্চতা ব্যবহার করে <img>
যা ব্যবহারকারীর অভিজ্ঞতা হ্রাস করবে এবং গুগল এটিকে অন্যতম গুরুত্বপূর্ণ কারণ হিসাবে ঘোষণা করেছে।
সিএসএস ওয়ার্কারআউন্ড
আপনি প্রস্থ এবং উচ্চতা সহ একটি ব্লক স্তর উপাদান ব্যবহার করতে বেছে নিতে পারেন, ব্যক্তিগতভাবে আমি একটি ব্যবহার করব না তবে ব্লক স্তর সম্পর্কে গুগল যা বলেছে তা এখানে।
চিত্রের উপাদান বা ব্লক-স্তরের পিতামাতার উপর মাত্রা নির্দিষ্ট করার বিষয়ে নিশ্চিত হন উপাদানটি নিজেই, বা একটি ব্লক-স্তরের পিতামাতার উপর মাত্রা নির্ধারণ করতে ভুলবেন না। পিতামাতারা যদি ব্লক-স্তর না করে থাকে তবে মাত্রা এড়ানো হবে। কোনও পূর্বপুরুষের উপর তাত্পর্য স্থাপন করবেন না যা তাত্ক্ষণিক পিতামাতার নয়।
আমি মনে করি এটি দেখতে কিছুটা এমন দেখাবে:
স্ট্যাটিক ডিজাইন .ic {width:500px;height:500px;}
প্রতিক্রিয়াশীল নকশা:
@media only screen and (max-width: 40em){.ic{width:1px;height:1px;}} Mobiles
@media only screen and (min-width: 40.063em){.ic{width:1px;height:1px;}} Tablets
@media only screen and (min-width: 40.063em) and (max-width: 64em){.ic{width:1px;height:1px;}} Small Screens
@media only screen and (min-width: 64.063em){.ic{width:1px;height:1px;}} Large Screens
তারপরে আপনার ভিউপয়েন্টটি সনাক্ত করতে জাভাস্ক্রিপ্ট বা অন্য কোনও সমাধান ব্যবহার করতে হবে এবং চিত্রটির 4 টি বিভিন্ন সংস্করণ পরিবেশন করতে হবে, যা আবার ব্যবহারিকের চেয়ে কম। সুতরাং আপনি যদি প্রতিক্রিয়াশীল ডিজাইন ব্যবহার করে থাকেন তবে আমি নিরাপদে এগিয়ে যাব এবং প্রস্থ এবং উচ্চতা যুক্ত করে বিরক্ত করব না যাতে আপনার ওয়েবসাইট যা স্ক্রীনই দেখুক না কেন তরল।