width অ্যাট্রিবিউট
width অ্যাট্রিবিউটটি সেই ছবির প্রস্থ নির্ধারণ করে,
যা img ট্যাগ দ্বারা নির্ধারিত।
বর্তমানে এই অ্যাট্রিবিউটটি শুধুমাত্র ছবি,
iframe,
video
এবং কিছু অন্যান্য ট্যাগের জন্য ব্যবহার করা অনুমোদিত।
পিক্সেল বা শতাংশে মান নির্দিষ্ট করা অনুমোদিত। শতাংশে আকার নির্দিষ্ট করার ক্ষেত্রে, এটি প্যারেন্টের প্রস্থ থেকে নেওয়া হবে। পিক্সেলে আকার নির্দিষ্ট করার ক্ষেত্রে, মাপের একক উল্লেখ করা হয় না।
যদি একটি ছবির জন্য প্রস্থ বা উচ্চতা কোনটিই নির্দিষ্ট করা না থাকে - ছবিটির তার নিজস্ব বাস্তব আকার থাকবে। যদি উচ্চতা নির্দিষ্ট করা থাকে - ছবিটি নির্দিষ্ট উচ্চতার হবে, এবং প্রস্থ সামঞ্জস্য করা হবে যাতে তার অনুপাত বিকৃত না হয়। যদি শুধুমাত্র প্রস্থ নির্দিষ্ট করা থাকে - অনুরূপভাবে, ছবিটি উচ্চতা অনুযায়ী সামঞ্জস্য হবে যাতে অনুপাত সংরক্ষিত থাকে। যদি প্রস্থ এবং উচ্চতা উভয়ই নির্দিষ্ট করা থাকে - ছবির অনুপাত বিকৃত হতে পারে (বা নাও হতে পারে, আপনি যেমন অনুমান করেন)। যদি প্রস্থ বা উচ্চতা (বা উভয়ই একসাথে) বাস্তবের চেয়ে বেশি হয় - ছবিটি বড় হবে, কিন্তু গুণমান হারাবে।
অ্যাট্রিবিউটে ছবির প্রস্থ এবং উচ্চতা নির্দিষ্ট করার পরামর্শ দেওয়া হয় - এই ক্ষেত্রে ব্রাউজার ছবিগুলি দ্রুত লোড করবে - এর জন্য প্রতিটি ছবি পাওয়ার পরে তার আকার গণনা করার প্রয়োজন নেই।
অপ্রয়োজনে ছবির বাস্তব আকার কমানোর পরামর্শ দেওয়া হয় না। উদাহরণস্বরূপ,
একটি ছবির বাস্তব আকার 1000 বাই 1000
পিক্সেল, এবং আপনি এটির প্রস্থ নির্ধারণ করেন 100px।
এই ক্ষেত্রে স্ক্রিনে ছবিটি 100 পিক্সেল দেখাবে,
তবে পুরো হাজার পিক্সেলের আকার থাকবে এবং সেই অনুযায়ী, লোড হতে
বেশি সময় নেবে।
কাজের উদাহরণ এখানে দেখুন:
img ট্যাগ।