HTML বাংলা টিউটোরিয়াল-14
কেমন আছেন সবাই।আশা করি সবাই ভাল আছেন।আমরা লাস্ট টিউন এ কিভাবে লিঙ্ক তৈরি
করতে হয় তা শিখেছিলাম, আজকে আমরা শিখব কিভাবে image এর মাধ্যমে লিঙ্ক
ব্যাবহার করা যায়।সাথেই থাকুন।
প্রথমে নোটপ্যাড ওপেন করুন।তারপর আগের টিউন এর নিয়ম অনুসারে নিচের কোডিংটুকু লিখুন
তারপর তা tech.html নামে সেভ করুন।এবার এই ফাইলটি একটি folder এ রাখি।
<html>
<head>
<title>
</title>
</head>
<body>
<h1>projukticorner.blogspot.com html image link creation </h1>
projukticorner.blogspot.com html image link creation <br>
projukticoener.blogspot.com html image link creation <br>
projukticoene.blogspot.com html image link creation <br>
projukticoene.blogspot.com html image link creation
</body>
</html>
এবার,আমরা যেই image টাকে লিঙ্ক হিসেবে ব্যাবহার করব সেই ইমেজটাকেও ওই folder এ রাখুন।আমি folder এ যেই ইমেজ ব্যাবহার করেছি তার নাম tech । এবার আসুন দেখি বাকি কোডিংটুকু কিভাবে করব তা দেখি।
আসুন নিচের মত কোডিং করি, তারপর তা imgtech.html নামে সেভ করি।
<html>
<head>
<title>
Image tech
</title>
</head>
<body>
<h1> projukticorner.blogspot.com html image link creation </h1>
projukticorner.blogspot.com html image link creation <br>
Click below for image.
<a href =tech.html ><img src = tech.jpg height=350 width=400></a>
</body>
</html>
এখানে, a href দিয়ে কি বুঝায়?a দিয়ে anchor ট্যাগ বুঝায়।আর এই ট্যাগ এর সাথে যে attribute টি ব্যাবহার করা হয় তা হল href. href দিয়ে কি বুঝায়? href দিয়ে hyper reference বুঝায়।এই ট্যাগ দিয়ে text বা, image এর path বলে দেওয়া হয়। ধরুন আপনি লিঙ্ক এ একটি image দিতে চাচ্ছেন,এই image এর নাম হচ্ছে house.তাহলে আপনার কোডিংটুকু হবে এইরকম
<a href =a1.html ><img src =house.jpg height=350 width=400></a>
আমি যে image টা ব্যাবহার করেছি তার নাম tech তাই আমি আমার কোডিং এ tech শব্দটা use করেছি।
এবার আসুন পরের বিষয়ে।আরেকটা বিষয় খেয়াল করেছেন।ছবির নামের পাশে .jpg ব্যাবহার করেছি।এর একটা কারন আছে।আপনার image টি যেই ফরম্যাট এর আপনি ইমেজ এর নামের শেষে সেই ফরম্যাট লিখবেন।ধরুন আপনার ইমেজ এর ফরম্যাট হচ্ছে png ফরম্যাট এর।তাহলে আপনি লিখবেন house.png(আপনার ইমেজ এর নাম .png)l
আর, height , width দিয়ে উচ্চতা,চওড়া বুঝায়।আপনি আপনার ইমেজ এর সাইজ কতটুকু দিবেন তা এটা দিয়ে উল্লেখ করা হয়।
এবার, লাস্ট এর কোডিংটুকু সেভ করে তা ওই ফোল্ডার এ রাখুন। সবকিছু কিন্তু একই ফোল্ডার এ থাকতে হবে,তা না হলে কিন্তু কাজ করবে না।
এবার, imgtech.html নামের পেজটাকে double click করে ওপেন করুন। তারপর ইমেজটাতে ক্লিক করুন। দেখবেন, অপর পেজটা চলে আসছে।
প্রথমে নোটপ্যাড ওপেন করুন।তারপর আগের টিউন এর নিয়ম অনুসারে নিচের কোডিংটুকু লিখুন
তারপর তা tech.html নামে সেভ করুন।এবার এই ফাইলটি একটি folder এ রাখি।
<html>
<head>
<title>
</title>
</head>
<body>
<h1>projukticorner.blogspot.com html image link creation </h1>
projukticorner.blogspot.com html image link creation <br>
projukticoener.blogspot.com html image link creation <br>
projukticoene.blogspot.com html image link creation <br>
projukticoene.blogspot.com html image link creation
</body>
</html>
এবার,আমরা যেই image টাকে লিঙ্ক হিসেবে ব্যাবহার করব সেই ইমেজটাকেও ওই folder এ রাখুন।আমি folder এ যেই ইমেজ ব্যাবহার করেছি তার নাম tech । এবার আসুন দেখি বাকি কোডিংটুকু কিভাবে করব তা দেখি।
আসুন নিচের মত কোডিং করি, তারপর তা imgtech.html নামে সেভ করি।
<html>
<head>
<title>
Image tech
</title>
</head>
<body>
<h1> projukticorner.blogspot.com html image link creation </h1>
projukticorner.blogspot.com html image link creation <br>
Click below for image.
<a href =tech.html ><img src = tech.jpg height=350 width=400></a>
</body>
</html>
এখানে, a href দিয়ে কি বুঝায়?a দিয়ে anchor ট্যাগ বুঝায়।আর এই ট্যাগ এর সাথে যে attribute টি ব্যাবহার করা হয় তা হল href. href দিয়ে কি বুঝায়? href দিয়ে hyper reference বুঝায়।এই ট্যাগ দিয়ে text বা, image এর path বলে দেওয়া হয়। ধরুন আপনি লিঙ্ক এ একটি image দিতে চাচ্ছেন,এই image এর নাম হচ্ছে house.তাহলে আপনার কোডিংটুকু হবে এইরকম
<a href =a1.html ><img src =house.jpg height=350 width=400></a>
আমি যে image টা ব্যাবহার করেছি তার নাম tech তাই আমি আমার কোডিং এ tech শব্দটা use করেছি।
এবার আসুন পরের বিষয়ে।আরেকটা বিষয় খেয়াল করেছেন।ছবির নামের পাশে .jpg ব্যাবহার করেছি।এর একটা কারন আছে।আপনার image টি যেই ফরম্যাট এর আপনি ইমেজ এর নামের শেষে সেই ফরম্যাট লিখবেন।ধরুন আপনার ইমেজ এর ফরম্যাট হচ্ছে png ফরম্যাট এর।তাহলে আপনি লিখবেন house.png(আপনার ইমেজ এর নাম .png)l
আর, height , width দিয়ে উচ্চতা,চওড়া বুঝায়।আপনি আপনার ইমেজ এর সাইজ কতটুকু দিবেন তা এটা দিয়ে উল্লেখ করা হয়।
এবার, লাস্ট এর কোডিংটুকু সেভ করে তা ওই ফোল্ডার এ রাখুন। সবকিছু কিন্তু একই ফোল্ডার এ থাকতে হবে,তা না হলে কিন্তু কাজ করবে না।
এবার, imgtech.html নামের পেজটাকে double click করে ওপেন করুন। তারপর ইমেজটাতে ক্লিক করুন। দেখবেন, অপর পেজটা চলে আসছে।
কোন মন্তব্য নেই
মনে রাখবেন: এই ব্লগের কোনও সদস্যই কোনও মন্তব্য পোস্ট করতে পারে৷