<img> ট্যাগ

<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">