বেসিক এইচটিএমএল(HTML)শিখুন টিউটোরিয়াল [পর্ব-২] : এইচটিএমএল এর গঠন ও ট্যাগ [TAG]

     imageবেসিক এইচটিএমএল টিউটোরিয়াল এর দ্বিতীয় পর্ব শুরু করছি গত    পর্বে আলোচণা করেছিলাম এইচটিএমএল  (HTML)  কি, এর     প্রয়োজনীয়তা  কি ও তার উপকরণ সম্পর্কে ।আজকের পর্বে থাকছে এইচটিএমএল এর গঠন ও ট্যাগ সম্পর্কে।

এইচটিএমএল এর গঠনঃ

     এইচটিএমএল এর প্রধানত দুটি অংশ থাকে। একটি অংশ হল হেড (head) অপরটি বডি (body head অংশটি শুরু হয়  <head>দিয়ে এবং শেষ হয় </head> দিয়ে।  অপর অংশটিও শুরু হয়  <body> দিয়ে শেষ হয়  </body> দিয়ে,  এবং এ দুটিকে <html></html> এর ভেতরে বসিয়ে দিতে হয়। নিচের অংশটুকু দেখলে আরও ভালো করে বুঝবেন।

<html>

   <head>

    </head>

     <body>

    </body>

</html>

আবার হেড এর ভিতর  টাইটেল বসাতে হয় আর বডিতে বর্ণনা দিতে হয়।  নিচে দেখুন

<html>

 <head>

 <title> my web title</title>

</head>

<body>

hello world, This is my first write in the web

</body>

</html>

এবার কোডটুকু  নোটপ্যাড বা যেকোনো এডিটরে লিখুন বা কপি পেস্ট করুন, এবং index.html নামে সেভ করে যেকোন ব্রাউজারে ওপেন করুন ,  এর পর নিজের প্রথম কোডিং ব্রাউজারে দেখুন

এইচটিএমএল ট্যাগঃ

images 

       এইচটিএমএল এ ট্যাগ এর গুরুত্ব অপরিসীম । কারন এইচটিএমএল গঠনের মুল বিষয় হচ্ছে ট্যাগ দিয়ে।  আর এইচটিএমএল শেখার আসল উদ্দেশ্য হচ্ছে ট্যাগ এর কাজ গুলো সম্পর্কে জানা।  এখানে দুই ধরনের ট্যাগ রয়েছে। একটি দিয়ে শুরু হয় আর অপরটি দিয়ে শেষ হয়। শুরুর ট্যাগটি <> আর শেষের ট্যাগটি </> এরকম।তবে ট্যাগগুলো ব্রাউজারে প্রদর্শিত হয় নাআর ট্যাগগুলো সবসময় ছোট হাতের বর্ণে হবে। শুরুর ট্যাগটিকে ওপেনিং আর শেষের ট্যাগটিকে ক্লোজিং ট্যাগ বলে।এই ওপেনিং আর  ক্লোজিং ট্যাগের ভিতর কনটেন্ট দিতে হয়

কয়েকটি ট্যাগের উদাহরণঃ

<html> </html>  এইচটিএমএল ডকুমেন্ট নির্দেশ করে ।
<head> </head>   এইচটিএমএল হেড অংশ নির্দেশ করে ।
<title> </title>  এইচটিএমএল
<body></body>  ডকুমেন্টের শিরোনাম তথা টাইটেল নির্দেশ করে ।
 <h></h>  হেডার অংশ নির্দেশ করে ।
<p> </p>  টেক্সট এর প্যারাগ্রাফ নির্দেশ করে ।
<b></b>  বোল্ড টেক্সট নির্দেশ করে ।
<i> </i>  ইতালিক টেক্সট নির্দেশ করে ।
<u> </u>  আন্ডারলাইন টেক্সট নির্দেশ করে ।
<a> </a>  লিংক টেক্সট নির্দেশ করে ।
<font></font>  ফন্ট এর প্যারামিটার নির্দেশ করে ।

 

তবে কিছু কিছু ট্যাগে ক্লোজিং ট্যাগ নেই ,যেমনঃ

 

<img/>  ইমেজ ট্যাগ নির্দেশ করে ।
<br/>  লাইন ব্রেক নির্দেশ করে ।

  আর্টিকেলটি পড়ার জন্য ধন্যবাদ। আগামি পর্বে লিখবো এইচটিএমএল এলিমেন্ট (Element ) নিয়ে।  আজ এই পর্যন্তআগামী পর্ব দেখার আমন্ত্রন জানিয়ে এখানেই শেষ করছি ।   

আরো পোস্ট দেখুন

comments