HTML এ Image Syntax যুক্ত করা
HTML এ Image যুক্ত করা হয় <img> ট্যাগ টি দিয়ে।
<img> Tag টি একটি শূণ্য ট্যাগ। এতে শুধু attribute থাকে। এবং এই ট্যাগ এর কোনো closing tag লাগে না।
src attribute টি image file টির লোকেশন নির্দেশ করে।
উদাহারনঃ
<img src="url">
alt নামক আরেকটি attribute আছে যা image এর একটি লেখা ধারন করে। যদি image প্রদর্শন সম্ভব না হয় তখন image এর স্থানে সেই লেখা দেখানো হয়।
উদাহারনঃ
<img src="html5.gif" alt="The official HTML5 Icon">
alt attribute টি প্রয়োজনীয়।
Image এর মাপ এবং স্টাইল
উচ্চতা এবং দৈর্ঘ
style নামক attribute ব্যবহার করে দৈর্ঘ ও উচ্চতা নির্দেশ করা যায়।
অথবা
width এবং height নামক attribute দিয়েও এ কাজ করা যায়।
HTML5 এই attribute গুলো ব্যবহার করা যায়।
উদাহারনঃ
<!DOCTYPE html>
<html>
<head>
<style>
img { width:100%; }
</style>
</head>
<body>
<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px">
<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">
</body>
</html>
<html>
<head>
<style>
img { width:100%; }
</style>
</head>
<body>
<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px">
<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">
</body>
</html>
নিজে চেষ্টা করুন »
উল্লেখ্য যে ,
ছবি একই ফোল্ডারে বা আলাদা ফোল্ডারে অথবা আলাদা সার্ভারেও থাকতে পারে ।
তখন নিম্নোক্ত উপায়ে লিঙ্ক করা হয়।
আগের ফোল্ডারেঃ
উদাহরনঃ
<img src="/images/html5.gif" alt="HTML5 Icon" style="width:128px;height:128px">
নিজে চেষ্টা করুন »
নিজ ফোল্ডারে,
উদাহারনঃ
<img src="wrongname.gif" alt="HTML5 Icon" style="width:128px;height:128px">
নিজে চেষ্টা করুন»
Images যখন অন্য সার্ভারে,
Animated Images
শুধু .GIF file
উদাহারনঃ
<img src="programming.gif" alt="Computer Man" style="width:48px;height:48px">
নিজে চেষ্টা করুন»
Image কে Link হিসেবে ব্যাবহার,
উদাহারনঃ
Example
<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0">
</a>
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0">
</a>
নিজে চেষ্টা করুন »
ধন্যবাদ ।
পরবর্তি পর্বে আমরা টেবিল ব্যবহার শিখব।
কোন মন্তব্য নেই:
একটি মন্তব্য পোস্ট করুন