আবার ও চলে আসলাম HTML নিয়ে। আশা করি আপনার আগের পর্বগুলো দেখছেন। না দেখে থাকলে নিছের লিঙ্কে ক্লিক করে গিয়ে দেখে আসতে পারেন। অথবা যদি আগের গুলো ভুলে গিয়ে থাকেন তাহলে পুনরায় পড়ে আসতে পারেনঃ
প্রধানত দুই ভাবে লিস্ট তৈরি করা যায়। একটা হচ্ছে ordered lists, এবং আরেকটা হচ্ছে unordered lists। নিচের ছবিতে একটি Orrderd List ও একটি unordered lists এর উদাহরন দেখানো হলঃ
Orderd List এর জন্য <ol> Tag ব্যবহার করতে হয়। তার পর এর ভিতরে কয় টা লিস্ট করবেন বা কয়টা উপাদান থাকবে তা <li> Tag এর বিতরে লিখতে হয়। নিচের উদাহরন টি দেখলে আরো শুবিধা হবে।
একই ভাবে unorderd List এর জন্য <ul> Tag ব্যবহার করতে হয়। তার পর এর ভিতরে কয় টা লিস্ট করবেন বা কয়টা উপাদান থাকবে তা <li> Tag এর বিতরে লিখতে হয়। নিচের উদাহরনটি দেখুনঃ
এ ছাড়া আরো অনেক ভাবে লিস্ট তৈরি করা যায়। নিচের উদাহরটি দেখুন তাহলে বুঝতে পারবেন। ছবিটি যদি দেখতে অসুবিদা হয় তাহলে নতুন ট্যাবে বড় করে দেখুন।
লিস্ট এর উপাদান গুলো সম্পর্কে কিছু লেখা বা তথ্য দেওয়ার জন্য HTML Definition Lists ব্যবহার করা হয়।
আমরা একটা লিস্ট তৈরি করছি। লিস্টের উপাদান সম্পর্কে কিছু ব্যাখ্যা দেওয়া ধরকার তার জন্য আছে <dl> ও <dd> Tag। <dl> দ্বারা Definition Lists তৈরি করা হয় এবং <dd> ট্যাগের সাহায্যে লিস্টের প্রত্যেকটি উপাদানের পর কিছু তথ্য যোগ করা হয়ঃ
একই লিস্টের ভিতর আরেকটি লিস্ট তৈরি করার জন্য HTML Nested Lists ব্যবহার করা হয়। নিচের উদাহরন টি দেখুনঃ
আপনার ইচ্ছে মতো একটির ভিতরে আরো কয়েকটি লিস্ট তৈরি করতে পারেবন।
ড্রপ ডাউন লিস্ট তৈরি করা জন্য নিচের উদাহরনটি লক্ষ্য করুনঃ
তাছাড়া আপনি ড্রপ ডাউনের অপশন গুলোকে বিভাগ অনুযায়ী সাজাতে পারেন। তার জন্য নিছের উদাহরনটি দেখুনঃ
এখানে টেকনলজি ব্লগ গুলো একটার নিছে আরেকটা টেকনলজি ব্লগ বিভাগের মধ্যে থাকবে। আবার নন টেকনলজি ব্লগ গুলো টেকনলজি ব্লগ বিভাগের মধ্যে থাকবে।
কোন সাইটে ব্যাক্তিগত তথ্য বা অন্য কোন তথ্য প্রবেশ করার জন্য HTML Formsব্যবহৃত হয়। একটি HTML form এ input উপাদান হিসেবে name filds, passwords, text fields, check boxe, radio-buttons, submit buttons ইত্যাদি থাকতে পারে।
আমরা কোন সাইটে প্রবেশ করার জন্য নাম ও পাসওয়ার্ড দিয়ে ঢুকতে হয় যা HTML Forms দিয়ে তৈরি করা।
উপরের উদাহরনে <form> Tag দিয়ে আগে Form তৈরি করা হয়েছে। তার পর এ ট্যাগের ভিতরে ফরমের উপাদান গুলো তৈরি করা হয়েছে। ফরমের আগে কি লেখা থাকবে প্রথমে তা দিতে হয়, তারপর <input type="text" name="firstname" /> দিয়ে Name ইনপুট নেওয়ার জন্য একটা বক্স তৈরি হবে। একই ভাবে <input type="password" name="pwd" /> দিয়ে পাসওয়ার্ড নেওয়ার জন্য একটি বক্স তৈরি হবে। password ফিল্ডের লেখা গুলো দেখা যায় না। যখন password এর ঘরে কোন কিছু ইনপুট দেওয়া হয় তখন asterisks বা ছোট কালো বৃত্ত উঠে। কিন্তু নেইম ফিল্ডের লেখা গুলো দেখা যায়। স্বাভাবিক ভাবে একটি বক্স গুলো ২০ টি Chrecter এর সমান হয়। তাছাটা আপনি ইচ্ছে করলে বক্স গুলোর সাইজ ঠিক করে দিতে পারেন। পরের উদাহরনে দেখতে পারবেন কিভাবে বক্সের সাইজ নির্ধারন করে দেওয়া যায়।
একই গ্রুপের ইনপুট গুলোকে একটি বক্সে রাখাঃ
আপনি চাচ্ছেন একই গ্রুপের ইনপুট গুলোকে একটি বক্সে রাখতে। তার জন্য <legend> ট্যাগ ব্যবহার করতে হবে। নিচের উদাহরন দেখলে আরো পরিস্কার হবেঃ
এখানে ব্যক্তিগত তথ্য সবগুলো আলাদা করে একটি বক্সের ভিতরে রয়েছে।
অনেক সময় কোন কিছু সিলেক্ট করার জন্য Radio Buttos তৈরি করতে হয়। তার জন্য input type=" radio" দিলেই হবে।উদাহরনঃ
চেক বক্স তৈরি করার জন্য <input type="checkbox" /> দিলে চেকবক্স তৈরি হবে। বাকিটা আগের গুলোর মত। উদাহরনঃ
ব্যবহারকারীরা লেখার জন্য একটি অংশ সৃষ্টি করার জন্য TexT Area ব্যবহৃত হয়। নিচের উদাহরন টি করলে বুঝতে পারবেনঃ
ধন্যবাদ সবাইকে । আবার ও দেখা হবে HTML নিয়ে।
পরের পর্বঃ HTML শিখুন HTML5 সহ [পর্ব-8]
আমি জাকির হোসাইন। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 14 বছর যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 224 টি টিউন ও 1487 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 5 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।
পৃথিবীতে অল্পকয়েক দিনের জন্য অনেকেই আসে, হেঁটে খেলে চলে যায়। এর মধ্যে অল্প কয়েক জনই পায়ের চাপ রেখে যায়।ওদের একজন হতে ইচ্ছে করে। প্রযুক্তির আরেকটি সেরা ব্লগ টেকটুইটস। আপনাদের স্বাগতম, যেখানে প্রতিটি বন্ধুর অংশ গ্রহনে গড়ে উঠেছে একটি পরিবার। আপনাদের পছন্দ হবে আশা করি। ফেসবুকে আমি - ?জাকির!
