এইচটিএমএল লিস্ট

এইচটিএমএল লিস্ট ব্যবহার করে আপনি কোন কিছুর তালিকা প্রকাশ করতে পারেন । আমরা ওয়েবসাইটের মেনু তৈরি করার সময় সাধারণত এইচটিএমএল লিস্ট ব্যবহার করে থাকি । এছাড়া, আমরা কোন কিছু পয়েন্ট আকারে লিখতে চাইলে এইচটিএমএল লিস্ট ব্যবহার করি । এইচটিএমএল এ সাধারণত দুই ধরনের লিস্ট রয়েছে । এ দুইটি লিস্ট হচ্ছে;

  • Order List (অর্ডার লিস্ট)
  • Unorder List (আন অর্ডার লিস্ট)

Order List (অর্ডার লিস্ট): আমরা কোন তালিকা যখন ক্রমিক সংখ্যা অনুযায়ী লিখে থাকি তখন আমরা এইচটিএমএল অর্ডার লিস্ট ব্যবহার করতে পারি । এখন একটা উদাহরণ দিলে ব্যাপারটি আপনাদের কাছে সম্পূর্ণ পরিষ্কার হয়ে যাবে । এজন্য নিচের কোডটুকু লিখে index.html নামে সেভ করুন;

<!DOCTYPE HTML>
<html>
<head>
 <title> HTML Order List </title>
</head>
<body>
 <ol>
 <li> HTML </li>
 <li> CSS </li>
 <li> JavaScript </li>
 <li> PHP </li>
 <li> WordPress </li>
 </ol>
</body>
</html>

এবার index.html ফাইলটি ব্রাউজারে প্রদর্শন করান তাহলে আপনি নিচের চিত্রের মত দেখতে পারবেন;

sshot-10

কোড বিশ্লেষণঃ আমরা সাত নম্বর লাইনে ol ব্যবহার করেছি । ol মানে হচ্ছে Order List এবং প্রতিটি লিস্ট এর জন্য ol এর ভিতরে li ব্যবহার করা হয় ।

Un order List (আন অর্ডার লিস্ট): আমরা কোন তালিকা যখন ক্রমিক সংখ্যা অনুযায়ী না লিখে লিস্ট প্রকাশ করে থাকি তখন আমরা এইচটিএমএল আন অর্ডার লিস্ট ব্যবহার করতে পারি । এখন একটা উদাহরণ দিলে ব্যাপারটি আপনাদের কাছে সম্পূর্ণ পরিষ্কার হয়ে যাবে । এজন্য নিচের কোডটুকু লিখে index.html নামে সেভ করুন;

<!DOCTYPE HTML>
<html>
<head>
 <title> HTML Un Order List </title>
</head>
<body>
 <ul>
 <li> HTML </li>
 <li> CSS </li>
 <li> JavaScript </li>
 <li> PHP </li>
 <li> WordPress </li>
 </ul>
</body>
</html>

এবার index.html ফাইলটি ব্রাউজারে প্রদর্শন করান তাহলে আপনি নিচের চিত্রের মত দেখতে পারবেন;

sshot-11

কোড বিশ্লেষণঃ আমরা সাত নম্বর লাইনে ul ব্যবহার করেছি । ul মানে হচ্ছে Un Order List এবং প্রতিটি লিস্ট এর জন্য ul এর ভিতরে li ব্যবহার করা হয় ।

Series Navigation<< এইচটিএমএল ইমেজএইচটিএমএল লিঙ্ক >>

Leave a Reply

Your email address will not be published. Required fields are marked *

Skip to toolbar