<img> ট্যাগগুলিতে width এবং height বৈশিষ্ট্যগুলি সেট করা লেআউট পরিবর্তন প্রতিরোধে সহায়তা করে। এই তথ্যটি ব্রাউজারটিকে ছবির জন্য সঠিক পরিমাণ স্থান সংরক্ষণ করতে দেয়।
widthএবংheightবৈশিষ্ট্যগুলি সেট করুন: এই বৈশিষ্ট্যগুলির মানগুলি চিত্রটির মাত্রাগুলির সাথে মেলে (অর্থাৎ, এটির অন্তর্নিহিত আকার ) - চিত্রটি প্রদর্শিত হবে এমন মাত্রাগুলির পরিবর্তে সেট করা উচিত৷প্রয়োজন অনুসারে চিত্রের স্টাইলিং সামঞ্জস্য করুন: চিত্রের বিদ্যমান স্টাইলের উপর নির্ভর করে,
widthএবংheightবৈশিষ্ট্যগুলি যোগ করার ফলে চিত্রটি ভিন্নভাবে রেন্ডার হতে পারে। অনেক ক্ষেত্রে, বিদ্যমান স্টাইলিংয়েheight: autoবাwidth: autoযোগ করে এটি ঠিক করা যেতে পারে।
| পূর্ববর্তী CSS স্টাইলিং | পরিবর্তন |
|---|---|
| img { প্রস্থ: 100%; } | img { প্রস্থ: 100%; উচ্চতা: স্বয়ংক্রিয়; } |
| img { সর্বোচ্চ-প্রস্থ: 100%; } | img { সর্বোচ্চ-প্রস্থ: 100% উচ্চতা: স্বয়ংক্রিয়; } |
| img { উচ্চতা: 100%; } | img { উচ্চতা: 100%; প্রস্থ: স্বয়ংক্রিয় } |
এইচটিএমএল
<img width="267" height="400" src="dog.jpg">