ইমেজ



একটি ওয়েব পেজ কে দৃষ্টিনন্দন ও আকর্ষণীয় করে তোলার জন্য ইমেজ এর ব্যবহার অনস্বীকার্য। ওয়েব পেজ কে সুন্দর করে সাজাতে যেমন বিভিন্ন স্টাইলের ফন্ট, মানানসই কালার এর প্রয়োজন, তেমনি সুন্দর ইমেজ এর প্রয়োজনীয়তাও রয়েছে। সঠিক স্থানে সঠিক ইমেজ এর ব্যবহার একটি ওয়েব পেজ এর উন্নত আউটলুক নির্ধারণে সহায়তা করে।


এইচটিএমএল <img> ট্যাগ ও src এট্রিবিউট

এইচটিএমএল এ ইমেজ কে প্রদর্শন বা ডিফাইন করার হয় <img> ট্যাগ ব্যবহার করে। এটি একটি খালি বা empty ট্যাগ অর্থাৎ এর কোন শেষ ট্যাগ নেই, সুধু এট্রিবিউট আছে। ওয়েব পেজে ইমেজ প্রদর্শন করার জন্য আপনাকে src এট্রিবিউট ব্যবহার করতে হবে। src হল ‘source’ এর সংক্ষিপ্ত রূপ। src এট্রিবিউটের মান হল যে ইমেজ টি আপনি প্রদর্শন করতে চাচ্ছেন তার url বা ঠিকানা অর্থাৎ ইমেজ টি কোথায় সংরক্ষিত আছে তার ঠিকানা।

উদাহরণ দেখুন

<body>
<img src="image_name.formate"/>
</body>


নোট - যদি আপনি একটি ইমেজ কে ২টি প্যারাগ্রাফ এর মাঝে রাখেন তবে ব্রাউজার আগে ১ম প্যারাগ্রাফ পরে ইমেজটি ও তারপর ২য় প্যারাগ্রাফটি প্রদর্শন করবে।


alt এট্রিবিউট

কোন কারনে ব্রাউজার যদি ইমেজ প্রদর্শনে ব্যার্থ হয় বা ইউজার ইমেজ বন্ধ করে রাখে বা ধীরে ধীরে পেজ লোড হবার কারনে যদি ইমেজ লোড না হয় তবে ইমেজ এর স্থানে একটি বক্স বা আইকন দেখা যায় যেটার উপর কার্সর রাখলে টুলটিপের মধ্যে ইমেজ সম্পর্কে কোন তথ্য বা উপাত্ত দেখা যায়। alt এট্রিবিউট ব্যবহার করে এই কাজটি করা যায়।

উদাহরণ দেখুন

<body>
<img src="image_name.formate" alt="a data about image"/>
</body>


নোট - যদি আপনি একটি ইমেজ কে ২টি প্যারাগ্রাফ এর মাঝে রাখেন তবে ব্রাউজার প্রথমে ১ম প্যারাগ্রাফ পরে ইমেজটি ও তারপর ২য় প্যারাগ্রাফটি প্রদর্শন করবে।


height এবং weight এট্রিবিউট

কোন ছবি বা image এর দৈর্ঘ্য অর্থাৎ height এবং প্রস্থ অর্থাৎ width নির্ধারণ করার জন্য img ট্যাগের সাথে height এবং width এট্রিবিউট ব্যবহার করা হয়।

উদাহরণ দেখুন

<img src="demo.jpg" alt="demo image" width="400" height="250" />


এর দৈর্ঘ্য অর্থাৎ height এবং প্রস্থ অর্থাৎ width এর মান বা value স্বয়ংক্রিয় বা defoult ভাবেই pixel এ নির্ধারিত হয়।

height এবং width এট্রিবিউট ব্যবহার করে image এর height এবং width পূর্ব থেকেই নির্ধারণ করে দেয়ার একটি ভাল দিক হল এতে করে ব্রাউজার আগে থেকেই image এর আকার জানতে পারে এবং পেজ লোড হওয়ার সময় ওয়েব পেজের লেআউট এ এর কোন প্রভাব পরে না।







এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Copyright 2016-2018 by websschool.com, All Rights Reserved.