এইচ টি এম এল(HTML) লিস্ট এর ব্যবহার (Use of HTML List) যেভাবে করবেন
আসসালাসু আলাইকুম।আপনারা কেমন আছেন?
তো আমরা গত পর্বে শিখেছি যে HTML এর font ট্যাগ ব্যবহৃত কালার করবেন যেভাবে। আর আজকে যে বিষয় নিয়ে আলোচনা করব সেটি হলো এইচ টি এম এল(HTML) লিস্ট এর ব্যবহার (Use of HTML List)যেভাবে করবেন তো চলেন দেরি না করে শুরু করা যাক।
ওয়েব পেজকে সুন্দর করে সাজানো এবং তথ্য উপস্থাপন করার অন্যতম পদ্ধতি হলো লিস্ট। HTML এর মাধ্যমে তিন ধরনের লিস্ট তৈরি করা যায়। যথা-
১,অর্ডার লিস্ট(Order list)
২,আনঅর্ডার লিস্ট (Unorder list)
৩,ডেফিনেশন লিস্ট (Definition list)
১,অর্ডার লিস্ট(Order list) ঃ অর্ডার লিস্ট এর ক্ষেত্রে প্রতিটি লাইনের একটি ক্রমিক নাম্বার বা বর্ণ থাকে। অর্ডার লিস্ট শুরু হয় <ol> ট্যাগ দিয়ে এবং প্রতিটি লিস্ট আইটেম শুরু হয় <li> ট্যাগ দিয়ে। লিস্ট আইটেমের ভেতরে প্যারাগ্রাফ, লাইন ব্রেক,ইমেজ,লিংক এবং অ্যান্যান্য লিস্টসমূহও বসানো যায়। অর্ডার লিস্টে মুলতঃ Alphabet type list (A),Number type list (1), ও Roman number type list (I), ব্যবহৃত হয়।
উদাহরণঃ Bangla,English and Information & Communication বিষয়হুলোকে নাম্বার অর্ডার লিস্ট আকার প্রদর্শনের বা দেখানোর জন্য HTMLL কোড লিখ।
<html>
<head><title> Number order list </title> </head>
<body>
<h1> Number order list </h1>
<ol type="1">
<li> Bangla </li>
<li> English </li>
<li> Imformation & Communication Technology </li>
</ol>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
২,আনঅর্ডার লিস্ট (Unorder list)ঃআনঅর্ডার লিস্টে ক্রমিক নাম্বার বা বর্ণ থাকে কিছু থাকে না শুধু মার্কিং করার জন্য ছোট বৃত্তাকার বা বর্গাকার চিহ্ন থাকে যা বুলেট নামে পরিচিত। আনঅর্ডার্ড লিস্ট শুরু হয় <ul> ট্যাগ দিয়ে এবং প্রতিটি লিস্ট আইটেম শুরু হয় <li> ট্যাহ দিয়ে। আনঅর্ডার লিস্টে মুলতঃCircle type list (o), Disc type list, ও Square type list ব্যবহৃত হয়।
উদাহরণঃ Bangla,English and Information & Communication Technology Circle type আন অর্ডার লিস্ট আকারে প্রর্দশনের বা দেখানোর জন্য HTML কোড লিখ।
<html>
<head> <title> Square type unorder list </title> </head>
<body>
<h1> Square type unorder </h1>
<ul type="Square">
<li> Bangla</li>
<li> English</li>
<li> Information & Communication Technology </li>
</ul>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
৩,ডেফিনেশন লিস্ট (Definition list)ঃডেফিনেশন লিস্ট হলো HTML এর বিষেশ ধরনের লিস্ট যা গ্লোসারি লিস্ট নামেও পরিচিত। মুলতঃ লিস্টের আইটেমসমূহের বর্ণানার জন্য এ ধরনের লিস্ট ব্যবহৃত হয়।ডেফিনিশন লিস্টে শুরু হয় <dl> ট্যাগ দিয়ে এবং শেষ হয় </dl> ট্যাগ দিয়ে। প্রতিটি আইটেম শুরু হয় <dt> ট্যাগ দিয়ে আর প্রতিটি বর্ণনা শুরু হয় <dd> ট্যাগ দিয়ে। ট্যাগের মধ্যে প্যারাগ্রাফ, লাইন ব্রেক, ইমেজ,লিংক এবং অন্যান্য লিস্টসমূহ বসানো যায়। অবশ্য <dt> এবং <dd> উভয়ের এমপিটি ট্যাগ। তাই এদের ক্লোজিং ট্যাগের প্রয়োজন হয় না।
উদাহরণঃ IT (Information Technology), ICT (Information &Communication Technology) ইত্যাদিকে ডেফিনেশন লিস্ট এর সাহায্যে প্রকাশের HTML কোড লিখ।
<html>
<body>
<h1> A Definition List: </h1>
<d1>
<dt> IT
<dd> Information Technology.
<dt> ICT
<dd> Information &Communication Technology.
</d1>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
আজকে এই পর্যন্তই, আবার কোন একদিন দেখা হবে ইনশাআল্লাহ্ , HTMLবা ওয়েব ডিজাইন কোন পোস্ট নিয়ে। আপাতত সবাই ভালো থাকুন, সুস্থ থাকুন। আল্লাহ্র কাছে সবসময় এই দোয়াই করি। আল্লাহ্ হাফেয…
আসসালাসু আলাইকুম।আপনারা কেমন আছেন?
তো আমরা গত পর্বে শিখেছি যে HTML এর font ট্যাগ ব্যবহৃত কালার করবেন যেভাবে। আর আজকে যে বিষয় নিয়ে আলোচনা করব সেটি হলো এইচ টি এম এল(HTML) লিস্ট এর ব্যবহার (Use of HTML List)যেভাবে করবেন তো চলেন দেরি না করে শুরু করা যাক।
ওয়েব পেজকে সুন্দর করে সাজানো এবং তথ্য উপস্থাপন করার অন্যতম পদ্ধতি হলো লিস্ট। HTML এর মাধ্যমে তিন ধরনের লিস্ট তৈরি করা যায়। যথা-
১,অর্ডার লিস্ট(Order list)
২,আনঅর্ডার লিস্ট (Unorder list)
৩,ডেফিনেশন লিস্ট (Definition list)
১,অর্ডার লিস্ট(Order list) ঃ অর্ডার লিস্ট এর ক্ষেত্রে প্রতিটি লাইনের একটি ক্রমিক নাম্বার বা বর্ণ থাকে। অর্ডার লিস্ট শুরু হয় <ol> ট্যাগ দিয়ে এবং প্রতিটি লিস্ট আইটেম শুরু হয় <li> ট্যাগ দিয়ে। লিস্ট আইটেমের ভেতরে প্যারাগ্রাফ, লাইন ব্রেক,ইমেজ,লিংক এবং অ্যান্যান্য লিস্টসমূহও বসানো যায়। অর্ডার লিস্টে মুলতঃ Alphabet type list (A),Number type list (1), ও Roman number type list (I), ব্যবহৃত হয়।
উদাহরণঃ Bangla,English and Information & Communication বিষয়হুলোকে নাম্বার অর্ডার লিস্ট আকার প্রদর্শনের বা দেখানোর জন্য HTMLL কোড লিখ।
<html>
<head><title> Number order list </title> </head>
<body>
<h1> Number order list </h1>
<ol type="1">
<li> Bangla </li>
<li> English </li>
<li> Imformation & Communication Technology </li>
</ol>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
২,আনঅর্ডার লিস্ট (Unorder list)ঃআনঅর্ডার লিস্টে ক্রমিক নাম্বার বা বর্ণ থাকে কিছু থাকে না শুধু মার্কিং করার জন্য ছোট বৃত্তাকার বা বর্গাকার চিহ্ন থাকে যা বুলেট নামে পরিচিত। আনঅর্ডার্ড লিস্ট শুরু হয় <ul> ট্যাগ দিয়ে এবং প্রতিটি লিস্ট আইটেম শুরু হয় <li> ট্যাহ দিয়ে। আনঅর্ডার লিস্টে মুলতঃCircle type list (o), Disc type list, ও Square type list ব্যবহৃত হয়।
উদাহরণঃ Bangla,English and Information & Communication Technology Circle type আন অর্ডার লিস্ট আকারে প্রর্দশনের বা দেখানোর জন্য HTML কোড লিখ।
<html>
<head> <title> Square type unorder list </title> </head>
<body>
<h1> Square type unorder </h1>
<ul type="Square">
<li> Bangla</li>
<li> English</li>
<li> Information & Communication Technology </li>
</ul>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
৩,ডেফিনেশন লিস্ট (Definition list)ঃডেফিনেশন লিস্ট হলো HTML এর বিষেশ ধরনের লিস্ট যা গ্লোসারি লিস্ট নামেও পরিচিত। মুলতঃ লিস্টের আইটেমসমূহের বর্ণানার জন্য এ ধরনের লিস্ট ব্যবহৃত হয়।ডেফিনিশন লিস্টে শুরু হয় <dl> ট্যাগ দিয়ে এবং শেষ হয় </dl> ট্যাগ দিয়ে। প্রতিটি আইটেম শুরু হয় <dt> ট্যাগ দিয়ে আর প্রতিটি বর্ণনা শুরু হয় <dd> ট্যাগ দিয়ে। ট্যাগের মধ্যে প্যারাগ্রাফ, লাইন ব্রেক, ইমেজ,লিংক এবং অন্যান্য লিস্টসমূহ বসানো যায়। অবশ্য <dt> এবং <dd> উভয়ের এমপিটি ট্যাগ। তাই এদের ক্লোজিং ট্যাগের প্রয়োজন হয় না।
উদাহরণঃ IT (Information Technology), ICT (Information &Communication Technology) ইত্যাদিকে ডেফিনেশন লিস্ট এর সাহায্যে প্রকাশের HTML কোড লিখ।
<html>
<body>
<h1> A Definition List: </h1>
<d1>
<dt> IT
<dd> Information Technology.
<dt> ICT
<dd> Information &Communication Technology.
</d1>
</body>
</html>
ফলাফলঃ যে কোন ব্রাউজার সফ্টওয়্যার (internet Explorer/Mozilla Firefox)ব্যবহার করে ফাইলটি রান করলেই আউটপুট পাওয়া যাবে।
আজকে এই পর্যন্তই, আবার কোন একদিন দেখা হবে ইনশাআল্লাহ্ , HTMLবা ওয়েব ডিজাইন কোন পোস্ট নিয়ে। আপাতত সবাই ভালো থাকুন, সুস্থ থাকুন। আল্লাহ্র কাছে সবসময় এই দোয়াই করি। আল্লাহ্ হাফেয…