HTML বাংলা টিউটোরিয়াল পর্ব-১০
এইচটিএমএলে লিস্ট তৈরি
আসসালামু-আলাইকুম ।
আশা করি আপনারা সবাই ভাল আছেন। আজকে আমি আপনাদের মাঝে হাজির হলাম HTML বাংলা টিউটোরিয়াল পর্ব-১০ নিয়ে । এই সাইটের ফেসবুক পেইজে লাইক দিতে ভুলবেন না।
বাংলা টিউটোরিয়াল ফেসবুক পেজ
যারা আগের পর্ব দেখেন নাই তারা এখান থেকে দেখে নিতে পারেন।HTML বাংলা টিউটোরিয়াল পর্ব-০১
HTML বাংলা টিউটোরিয়াল পর্ব-০২
HTML বাংলা টিউটোরিয়াল পর্ব-০৩
HTML বাংলা টিউটোরিয়াল পর্ব-০৪
HTML বাংলা টিউটোরিয়াল পর্ব-০৫
HTML বাংলা টিউটোরিয়াল পর্ব-০৬
HTML বাংলা টিউটোরিয়াল পর্ব-০৭
HTML বাংলা টিউটোরিয়াল পর্ব-০৮
HTML বাংলা টিউটোরিয়াল পর্ব-০৯
পর্ব-১০ এ যা যা থাকবেঃ
এইচটিএমএলে লিস্ট তৈরির সিনট্যাক্স
আনঅর্ডার লিস্টঃ
অর্ডার লিস্টঃ
এইচটিএমএলে লিস্ট তৈরির সিনট্যাক্সঃ
পেইজে অনেক সময় আমাদের লিস্ট তৈরি করতে হয়। এই লিস্ট তৈরি করারা জন্য আমাদের লিস্ট ট্যাগ ব্যবহার করতে হয়। আমরা বিভিন্ন রকমের লিস্ট ব্যবহার করতে পারি । যেমন- সার্কল, বর্গ ইত্যাদি।সাধারণত দুই ধরনের লিস্ট হয়ে থাকে। আনওয়ার্ডার লিস্ট এবং অর্ডার লিস্ট।
আনঅর্ডার লিস্টঃ
উদাহরণঃ
<html>
<head>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
কোডটুকু লিখে un-order.html নামে সেভ করে ব্রাউজারে রান করুন।
আমরা এখানে বিভিন্ন স্টাইল ব্যবহার করতে পারি। যেমন-
ডিস্কের মত চাইলে-
<html>
<head>
</head>
<body>
<ul>
<ul style="list-style-type:circle">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</ul>
</body>
</html>
কোডটুকু লিখে disc.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
স্কয়ার এর মত চাইলে-
<html>
<head>
</head>
<body>
<ul style="list-style-type:square">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
কোডটুকু লিখে spuare.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
নান ব্যবহার করতে চাইলে-
<html>
<head>
</head>
<body>
<ul style="list-style-type:none">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
কোডটুকু লিখে none.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
অর্ডার লিস্টঃ
লিস্টে নাম্বার দিতে চাইলে-
<html>
<head>
</head>
<body>
<ol type="1">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
কোডটুকু লিখে order.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
আপার কেজ ব্যবহার করতে চাইলে-
<html>
<head>
</head>
<body>
<ol type="A">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
কোডটুকু লিখে uper.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
লোওার কেজ ব্যবহার করতে চাইলে-
<html>
<head>
</head>
<body>
<ol type="a">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
কোডটুকু লিখে lower.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
রোমান আপার কেজ ব্যবহার করতে চাইলে-
<html>
<head>
</head>
<body>
<ol type="I">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
কোডটুকু লিখে roman-uper.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
লোওয়ার রোমান কেজ ব্যবহার করতে চাইলে-
<html>
<head>
</head>
<body>
<ol type="i">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
কোডটুকু লিখে roman-lower.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
নেস্টেড লিস্ট বানাতে চাইলে-
<html>
<head>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
</body>
</html>
কোডটুকু লিখে nested.html নামে সেভ করে ব্রাউজারে রান করুন।
আউটপুটঃ
আপনি যতটুকু শিখবেন তা সবার মাঝে ছড়িয়ে দেওয়ার চেষ্টা করুন। এই পর্বে কোন বিষয়ে বুঝতে সমস্যা হলে কমেন্ট করুন। আমার পক্ষে যতটুকু সম্ভব সমাধান করার চেষ্টা করব। পেইজটি শেয়ার করতে ভুলবেন না। নিজে জানুন এবং অন্যকে জানাতে সাহায্য করুন। নিচে শেয়ার করার জন্য বিভিন্ন অপশন আছে যেমন ফেসবুক, টুইটার, গুগল প্লাস ইত্যাদি।
আজ আর নয়। পরের পর্বের আমন্ত্রণ জানিয়ে আজকের মত বিদায় বন্দুরা।
ধন্যবাদ সবাইকে।
HTML বাংলা টিউটোরিয়াল পর্ব-১১
HTML বাংলা টিউটোরিয়াল পর্ব-১২
HTML বাংলা টিউটোরিয়াল পর্ব-১৩
No comments:
Post a Comment