HTML Image

এইচটিএমএল ইমেজ

HTML img ট্যাগ ওয়েব পেজে ছবি প্রদর্শন করতে ব্যবহৃত হয়। HTML img ট্যাগ হল একটি খালি ট্যাগ যাতে শুধুমাত্র অ্যাট্রিবিউট থাকে, HTML ইমেজ এলিমেন্টে ক্লোজিং ট্যাগ ব্যবহার করা হয় না।

এইচটিএমএল ইমেজের একটি উদাহরণ দেখা যাক।

  1. <h2>HTML Image Exampleh2>  
  2. <img src=“good_morning.jpg" alt=“Good Morning Friends"/>

HTML img ট্যাগের বৈশিষ্ট্য

src এবং alt হল HTML img ট্যাগের গুরুত্বপূর্ণ বৈশিষ্ট্য। এইচটিএমএল ইমেজ ট্যাগের সমস্ত বৈশিষ্ট্য নীচে দেওয়া হয়েছে।

1) src

এটি একটি প্রয়োজনীয় বৈশিষ্ট্য যা ছবির উৎস বা পথ বর্ণনা করে। এটি ব্রাউজারকে নির্দেশ দেয় যে সার্ভারে চিত্রটি কোথায় দেখতে হবে।

চিত্রের অবস্থান একই ডিরেক্টরি বা অন্য সার্ভারে হতে পারে।

2) alt

alt বৈশিষ্ট্য চিত্রের জন্য একটি বিকল্প পাঠ্য সংজ্ঞায়িত করে, যদি এটি প্রদর্শন করা না যায়। Alt অ্যাট্রিবিউটের মান শব্দে চিত্রটিকে বর্ণনা করে। Alt অ্যাট্রিবিউটটি এসইও প্রত্যাশিতদের জন্য ভাল বলে মনে করা হয়।

3) প্রস্থ

এটি একটি ঐচ্ছিক বৈশিষ্ট্য যা চিত্র প্রদর্শনের জন্য প্রস্থ নির্দিষ্ট করতে ব্যবহৃত হয়। এটা এখন সুপারিশ করা হয় না. আপনার প্রস্থ বৈশিষ্ট্যের জায়গায় CSS প্রয়োগ করা উচিত।

4) উচ্চতা

এটি ছবির উচ্চতা h3. এইচটিএমএল উচ্চতা বৈশিষ্ট্যটি আইফ্রেম, চিত্র এবং অবজেক্ট উপাদানগুলিকেও সমর্থন করে। এটা এখন সুপারিশ করা হয় না. আপনার উচ্চতা বৈশিষ্ট্যের জায়গায় CSS প্রয়োগ করা উচিত।

img ট্যাগের সাথে উচ্চতা এবং প্রস্থ বৈশিষ্ট্যের ব্যবহার

আপনি আপনার ওয়েব পেজে কিভাবে একটি ইমেজ ইনসার্ট করতে হয় সে সম্পর্কে শিখেছেন, এখন আমরা যদি আমাদের প্রয়োজন অনুযায়ী ইমেজ প্রদর্শনের জন্য কিছু উচ্চতা এবং প্রস্থ দিতে চাই, তাহলে আমরা ইমেজের উচ্চতা এবং প্রস্থের বৈশিষ্ট্য দিয়ে এটি সেট করতে পারি।

উদাহরণ:

  1. <img src=“animal.jpg" height=“180" width=“300" alt=“animal image">  

দ্রষ্টব্য: সর্বদা উচ্চতা এবং প্রস্থ সহ চিত্রটি সন্নিবেশ করার চেষ্টা করুন, অন্যথায় এটি ওয়েবপেজে প্রদর্শনের সময় ঝিকঝিক করে উঠতে পারে।

Alt অ্যাট্রিবিউটের ব্যবহার

আমরা ট্যাগের সাথে alt অ্যাট্রিবিউট ব্যবহার করতে পারি। ইমেজ ব্রাউজারে প্রদর্শিত না হলে এটি একটি বিকল্প পাঠ্য প্রদর্শন করবে। নিম্নলিখিত alt বৈশিষ্ট্য জন্য উদাহরণ:

  1. <img src=“animal.png" height=“180" width=“300" alt=“animal image">      

কিভাবে অন্য ডিরেক্টরি/ফোল্ডার থেকে ইমেজ পেতে?

আপনার ওয়েবে একটি ছবি সন্নিবেশ করার জন্য, সেই ছবিটি আপনার একই ফোল্ডারে উপস্থিত থাকতে হবে যেখানে আপনি HTML ফাইলটি রেখেছেন। কিন্তু যদি কিছু ক্ষেত্রে ইমেজ অন্য কোন ডিরেক্টরিতে পাওয়া যায় তাহলে আপনি এই মত ইমেজ অ্যাক্সেস করতে পারেন:

  1. <img src=“E:/images/animal.png" height=“180" width=“300" alt=“animal image">  

উপরের বিবৃতিতে আমরা ইমেজকে স্থানীয় ডিস্ক E——>ইমেজ ফোল্ডার——>animal.png-এ রেখেছি।

দ্রষ্টব্য: যদি src URL ভুল বা ভুল বানান হয় তবে এটি ওয়েব পৃষ্ঠায় আপনার ছবি প্রদর্শন করবে না, তাই সঠিক URL দেওয়ার চেষ্টা করুন।

লিঙ্ক হিসাবে ট্যাগ ব্যবহার করুন

আমরা একটি চিত্রকে অন্য পৃষ্ঠার সাথে লিঙ্ক করতে পারি বা আমরা একটি লিঙ্ক হিসাবে একটি চিত্র ব্যবহার করতে পারি। এটি করার জন্য, ট্যাগের ভিতরে ট্যাগ দিন।

উদাহরণ:



Leave a Reply