HTML টিউটোরিয়াল: দ্বিতীয় পর্ব (হেডার ট্যাগ পরিচিতি)

ট্যাগ বা ট্যাগিং বলতে আমরা সাধারনত বুঝি একটি বস্তুর সাথে অন্য কোন বস্তুকে ঝুলিয়ে দেয়া। যেমনটা আমরা অনেকেই ফেসবুকে কোন ছবিকে আমদের বন্ধুদেরকে ট্যাগ করি ঠিক তেমটাই।

ভাষাগত দিকে থেকে একই হলেও HTML হেডার ট্যাগ গুলো কিছুটা ভিন্নতা প্রকাশ করে। যেমন, HTML এ <header> </header> একটি সেকশন ট্যাগ আছেই তারপরেও স্বতন্ত্র HTML এ header ট্যাগ আছে ছয়টি যেগুলো শুধু মাত্র <body> </body> সেকশনে ব্যবহার করা যায়: h1, h2, h3, h4, h5, h6। ট্যাগ গুলোর ব্যবহার একটু বিস্তারিত আলোচনাতে আসি –

হেডার ওয়ান ট্যাগ: সবচেয়ে বড় হেডার ট্যাগ। লিখাগুলোর সাইজ ৩৬ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।

<h1>This is H1 tag example</h1>

হেডার টু ট্যাগ: হেডার ওয়ান থেকে একটু ছোট। লিখাগুলোর সাইজ ৩০ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।
<h2>This is H2 tag example </h2>

হেডার থ্রী ট্যাগ: হেডার টু থেকে একটু ছোট। লিখাগুলোর সাইজ ২৪ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।
<h3>This is H3 tag example </h3>

হেডার ফোর ট্যাগ: হেডার থ্রী থেকে একটু ছোট। লিখাগুলোর সাইজ ১৮ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।
<h4>This is H4 tag example </h4>

হেডার ফাইভ ট্যাগ: হেডার ফোর থেকে একটু ছোট। লিখাগুলোর সাইজ ১৬ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।
<h5>This is H5 tag example </h5>

হেডার সিক্স ট্যাগ: হেডার ফাইভ থেকে একটু ছোট এবং সবচেয়ে ছোট ট্যাগ। লিখাগুলোর সাইজ ১৪/১২ পিক্সেল। সিএসএস এর মাধ্যমে আপনি এর ডিফল্ট সাইজকে ইচ্ছামত বড় করতে পারবেন।
<h6>This is H6 tag example </h6>

নোট প্যাডে লিখবেন যেভাবে-
<html>
<head>
<title>This is Header Tag Tutorial</title>
</head>

<body>
<h1>This is H1 tag example</h1>
<h2>This is H2 tag example </h2>
<h3>This is H3 tag example </h3>
<h4>This is H4 tag example </h4>
<h5>This is H5 tag example </h5>
<h6>This is H6 tag example </h6>
</body>

</html>

লিখাগুলো নোটপ্যাডে কপি পেষ্ট করে tag.html ফরমেটে সেভ করুন। তার পর tag.html ডকুমেন্টটি ডাবল ক্লিক করে ব্রাউজারে প্রদর্শণ করান। কোথায় কোন ভুল না থাকেলে অবশ্যই ফলাফল প্রদর্শণ করতে ভালভাবে।

আর সমস্যা হলে মন্তব্যে জানাবেন জানাবেন। 🙂

ধন্যযোগ সকলকে!🙂

2 thoughts on “HTML টিউটোরিয়াল: দ্বিতীয় পর্ব (হেডার ট্যাগ পরিচিতি)

মন্তব্য প্রদান করুন ...

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / পরিবর্তন )

Twitter picture

You are commenting using your Twitter account. Log Out / পরিবর্তন )

Facebook photo

You are commenting using your Facebook account. Log Out / পরিবর্তন )

Google+ photo

You are commenting using your Google+ account. Log Out / পরিবর্তন )

Connecting to %s