HTMবাংলাটিউটোরিয়াল পর্ব-০৩
বডি (Body) সেকশনের ব্যবহার
আসসালামু-আলাইকুম ।
আশা করি আপনারা সবাই ভাল আছেন। আজকে আমি আপনাদের মাঝে হাজির হলাম HTML বাংলা টিউটোরিয়াল পর্ব-০৩ নিয়ে । এই সাইটের ফেসবুক পেইজে লাইক দিতে ভুলবেন না।
বাংলা টিউটোরিয়াল ফেসবুক পেজ
যারা আগের পর্ব দেখেন নাই তারা এখান থেকে দেখে নিতে পারেন।
HTML বাংলা টিউটোরিয়াল পর্ব-০১
HTML বাংলা টিউটোরিয়াল পর্ব-০২
পর্ব-০৩-এ যা যা থাকবে-
বডি (Body) ট্যাগের সিনট্যাক্স (Syntax)
বডি সেকশনের এট্রিবিউটসমূহ
Bgcolor-এর ব্যবহার
Background-এর ব্যবহার
Text-এর ব্যবহার
Link-এর ব্যবহার
Vlink-এর ব্যবহার
Alink-এর ব্যবহার
বডি (Body) ট্যাগের সিনট্যাক্স (Syntax)
বডি ট্যাগ <body> দিয়ে শুরু এবং </body> দিয়ে শেষ করতে হয়। ব্রাউজারের বডিতে যা দেখায় তার সবই এই বডি (body) সেকশনে লিখতে হয়। টেবিল, ইমেজ, টেক্সট, ফর্ম, ফ্রেম এসবই বডি সেকশনে রাখতে হয়। বডি ট্যাগের সাথে কিছু এট্রিবিউট থাকে তা এখন আলোচনা করবো।
বডি সেকশনের এট্রিবিউটসমূহ
Bgcolor
Background
Text
Link
Vlink
Alink
Bgcolor-এর ব্যবহারঃ
এটি মূলত ওয়েব পেইজের ব্যাকগ্রাউন্ড-এর রঙ পরিবর্তন করার জন্য ব্যবহার করা হয়।
একটি উদাহরণ দিলে ভালভাবে বুঝতে পারবেন ।
<html>
<head>
<title>Color</title>
</head>
<body bgcolor="red">
<h1>Background Color is RED</h1>
</body>
</html>
উপরের কোডটুকু লিখে bgcolor.html নামে Save করুন এবং রান করান।
আউটপুটঃ
দেখা যাচ্ছে পেইজের রঙ লাল বর্নের হয়ে গেছে । এখানে বডিতে bgcolor="red" ব্যবহার করার জন্যই আসলে এটা হয়েছে। আপনি নানা ধরনের রঙ ব্যবহার করতে পারেন ।এখন আলোচনা করবো কিভাবে বিভিন্ন রঙ ব্যবহার করা যায় ।
রঙের ব্যবহারঃ
সাধারণত আমরা এ তিনটি পদ্ধতিতে রঙের ব্যবহার করে থাকি ।
পদ্ধতি-০১
প্রথম পদ্ধতি হচ্ছে নির্দিষ্ট করে কোন রঙের নাম বলে দেওয়া। যেমন- কালা, সাদা, লাল, সবুজ, নীল, হলুদ ইত্যাদি। এরকম ১৬ টি মৌলিক কালারের নাম নিচে দেওয়া হলো-
পদ্ধতি-০২
আমরা প্রায় সবাই rgb কালারের নাম শুনেছি। এটি তিনটি কালারের মিশ্রণ। এখানে থাকে Red,Green ও Blue । এখানে প্রত্যেকটি কালারের মান ০ থেকে শুরু করে ২৫৫ পর্যন্ত দেওয়া যায়। কালার ব্যবহারের সিন্ট্যাক্সট হলো-
উদাহরণঃ
<html>
<head>
<title>Color</title>
</head>
<body bgcolor="rgb(255,255,155)">
<h1>Background Color is RGB</h1>
</body>
</html>
উপরের কোডটুকু লিখে bgcolor.html নামে Save করুন এবং রান করান।
আউটপুটঃ
আপনি আরও বিভিন্ন মান দিয়ে চর্চা করুন ।
পদ্ধতি-০৩
তৃতীয় পদ্ধতি হচ্ছে হেক্সাডেসিমাল ব্যবহার করা। হেক্সা মানে হচ্ছে ছয়। তো বুঝতেই পারছেন এখানে ছয়টি ডিজিট থাকতে হবে। এখানেও rgb কালারের ব্যবহার । প্রথম দুটি ডিজিট হচ্ছে Red কালারের, ২য় দুটি ডিজিট হচ্ছে Green কালারের আর ৩য় দুটি ডিজিট হচ্ছে Blue কালারের।
হেক্সাডেসিমাল লেখার ক্ষেত্রে ৯ এর পর A,B.....F দিয়ে ১৬ পর্যন্ত শেষ করতে হয়।
এখানে ০ থেকে শুরু করে F পর্যন্ত রঙের গাঢ়ত্ব বাড়তেই থাকবে।
কালার ব্যবহারের সিন্ট্যাক্সট হলো-
bgcolor="#FFFFFF"
bgcolor="#0055AA"
উদাহরণঃ
<html>
<head>
<title>Color</title>
</head>
<body bgcolor="#0055AA">
<h1>Background Color is Hexadecimal</h1>
</body>
</html>
উপরের কোডটুকু লিখে bgcolor.html নামে Save করুন এবং রান করান।
আউটপুটঃ
এদের মধ্যে তৃতীয় পদ্ধতি হচ্ছে সবথেকে ভাল । আপনি যথা সম্ভব এটাই ব্যবহার করবেন।
Background-এ রঙের ব্যবহারঃ
ওয়েব পেইজে সুন্দর সুন্দর সিনারি, ছবি এসব ব্যাকগ্রাউন্ড হিসেবে ব্যবহার করার জন্য Background এট্রিবিউট ব্যবহার করা হয়।
এটি ব্যবহারের সিনট্যাক্স নিচে দেওয়া হলো-
<body backround=”image name.image format”>
ভালভাবে বুঝতে প্রথমে নিচের কোডগুলো নোটপ্যাডে লিখে ডেস্কটপে Save করুন।এবার ডেস্কটপে jpg ফরম্যাটের একটি ইমেজ flower নামে রাখুন।
<html>
<head>
<title>Color</title>
</head>
<body background="flower.jpg">
</body>
</html>
এবার ব্রাউজার দিয়ে ফাইলটি ওপেন করলে যে ছবিটি আপনি flower নামে রেখেছিলেন সেটি ব্রাউজারে দেখাবে।
আউটপুটঃ
মনে রাখবেন যেখানে আপনার ফাইল থাকবে সেই ফোল্ডারেই আপনার ইমেজ রাখতে হবে। অন্য জায়গায় থাকলে আলাদা লিংক করতে হয় সেটা যখন ইমেজের উপর পোষ্ট করবো তখন দেখাবো। আপাতত এ টুকুই দেখেন। আপনার ইমেজ পিএনজি বা গিফ হলে এভাবে দিতে হবে।
<body backround=”flower.png”>
<body backround=”flower.gif”>
টেক্সট-এ রঙের ব্যবহারঃ
আপনার বডির সকল লেখার কালার বিভিন্ন রঙের করার জন্য এটি ব্যবহার করা হয়।এটি ব্যবহারের সিনট্যাক্স হচ্ছে
<body text="red">
উদাহরণঃ
<html>
<head>
<title>Color</title>
</head>
<body text="red">
<h1>I love my Country</h1>
</body>
</html>
কোডটুকু লিখে text-color.html নামে Save করে রান করান। দেখবেন লেখাটি লাল বর্নের হয়েছে।
আউটপুটঃ
এবার বিভিন্ন কালারের নাম দিয়ে কয়েকবার চর্চা করুন। আগেই বলেছি এটা যত বেশি চর্চা করবেন তত বেশি অভিজ্ঞ হবেন।
লিংক-এ রঙের ব্যবহারঃ
আপনার ওয়েব পেইজের মধ্যে কিছু লিংক থাকলে সেই হাইপার লিংকের রঙ কেমন হবে তা এটি দিয়ে করা হয়।
এটি ব্যবহারের সিনট্যাক্স হচ্ছে
<body link="blue">
উদাহরণঃ
<html>
<head>
<title>Webpage</title>
</head>
<body link="blue">
<a href=#"><h2>I love my Country</h2></a>
</body>
</html>
আউটপুটঃ
কোডটুকু লিখে link-color.html নামে Save করে রান করান।দেখবেন লেখাটির উপর মাউস নিলে মাউসের কার্সর হাতের মত দেখাচ্ছে। কারণ এটি একটি লিংক। আবার দেখবেন লেখাটি লাল বর্নের হয়েছে।কারণ লিংকে রেড ব্যবহার করেছি। লিংক সম্পর্কে আমরা পরে বিশদভাবে আলোচনা করবো।
আপনি যতটুকু শিখবেন তা সবার মাঝে ছড়িয়ে দেওয়ার চেষ্টা করুন। এই পর্বে কোন বিষয়ে বুঝতে সমস্যা হলে কমেন্ট করুন। আমার পক্ষে যতটুকু সম্ভব সমাধান করার চেষ্টা করব। পেইজটি শেয়ার করতে ভুলবেন না। নিজে জানুন এবং অন্যকে জানাতে সাহায্য করুন। নিচে শেয়ার করার জন্য বিভিন্ন অপশন আছে যেমন ফেসবুক, টুইটার, গুগল প্লাস ইত্যাদি।
আজ আর নয়। পরের পর্বের আমন্ত্রণ জানিয়ে আজকের মত বিদায় বন্দুরা।
ধন্যবাদ সবাইকে।
HTML বাংলা টিউটোরিয়াল পর্ব-০৩
HTML বাংলা টিউটোরিয়াল পর্ব-০৪
HTML বাংলা টিউটোরিয়াল পর্ব-০৫
HTML বাংলা টিউটোরিয়াল পর্ব-০৬
HTML বাংলা টিউটোরিয়াল পর্ব-০৭
HTML বাংলা টিউটোরিয়াল পর্ব-০৮
HTML বাংলা টিউটোরিয়াল পর্ব-০৯
HTML বাংলা টিউটোরিয়াল পর্ব-১০
HTML বাংলা টিউটোরিয়াল পর্ব-১১
HTML বাংলা টিউটোরিয়াল পর্ব-১২
HTML বাংলা টিউটোরিয়াল পর্ব-১৩
No comments:
Post a Comment