অর্ডার লিস্ট (Ordered List) | সি এস এস বাংলা টিউটোরিয়াল

লিস্ট (List)

ওয়েব পেজে তথ্য উপস্থাপনার একটি  অন্যতম পদ্ধতি লিষ্ট । CSS দ্বারা তিন ধরণের লিস্ট তৈরি করা যায়, একটি হচ্ছে অর্ডার লিস্ট এবং অপরটি হচ্ছে আনঅর্ডার লিস্ট । অর্ডার লিস্টে বিভিন্ন তথ্যকে পর্যায়ক্রমিকভাবে সাজিয়ে উপস্থাপন করা হয় এবং প্রতিটা লাইনের শুরুতে ক্রমিক সংখ্যা থাকে, আন অর্ডার লিস্টে প্রতিটা লাইনের সামনে ছোট বৃত্তাকার বা বর্গাকার চিহ্ন থাকে। এছাড়া লিস্টে যেকোন সিম্বলের পরিবর্তে ছোট আকারের ইমেজ ব্যবহার করা যায়।

অর্ডার লিস্ট (Ordered List)

অর্ডার লিস্টে বিভিন্ন তথ্যকে পর্যায়ক্রমিকভাবে সাজিয়ে উপস্থাপন করা হয় এবং প্রতিটা লাইনের শুরুতে ক্রমিক সংখ্যা থাকে।অর্ডার লিস্ট বেশ কয়েক ধরণের হতে পারে। যেমন এ্যালফাবেটিক, ডেসিমাল, রোমান ইত্যাদি। এ্যালফাবেটিক স্টাইল লিস্ট তৈরি করার জন্য Declaration  করতে হবে list-style-type:upper-alpha; অথবা list-style-type:lower-alpha; । ডেসিমাল স্টাইল লিস্ট তৈরি করার জন্য Declaration  করতে হবে list-style-type:decimal; রোমান স্টাইল লিস্ট তৈরি করার জন্য Declaration  করতে হবে list-style-type:upper-roman; অথবা list-style-type:lower-roman; ।

অনুশীলন প্রজেক্ট

<html>
<head>
<title> www.tutohost.com</title>
<style>
body{background:#00CC99; margin-left:120px;}
h1{color:#F00;}
#alphabet {list-style-type:lower-alpha;}
#decimal {list-style-type:decimal;}
#roman {list-style-type:lower-roman; }

</style>

</head>
<body >
h1>Ordered list</h1>
<h3>Alphabet Type list</h3>
<ol id="alphabet">
<li>Home</li>
<li>About Us</li>
<li>Contact Us</li>
</ol>
<h3>Number Type list</h3>
<ol id="decimal">
<li>HTML</li>
<li>CSS</li>
<li>PHP</li>
</ol>
<h3>Roman Number Type list</h3>
<ol id="roman">
<li>Pragaph</li>
<li>Table</li>
<li>List</li>
</ol>
</body>
</html>

একটা  নোটপ্যাড  open  করে  উপরের code  টুকু  লিখে  file  মেনু  থেকে  Save as এ ক্লিক করে File name:  index.html  ,   Save as type : All files,  দিয়ে save করে index.html ফাইলটি Mozilla Firefox দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।



লেখকঃ অসীম কুমার
তিনি ইলেকট্রিক্যাল ইঞ্জিনিয়ারিং এ লেখাপড়া করছেন। টিউটোরিয়ালবিডি ও বিজ্ঞানপ্রযুক্তি ব্লগে তিনি ইলেক্ট্রনিক্স সহ বিভিন্ন টেকনোলজি বিষয়ে লিখে থাকেন। বর্তমানে তিনি লেখাপড়ার পাশাপাশি টিউটোহোস্টে কর্মরত আছেন।

কপি রাইট © ২০১১-২০১২ সর্বস্বত্ত্ব সংরক্ষিত, টিউটরিয়ালবিডি, একটি টিউটো ওয়েবস প্রতিষ্ঠান.