বুটস্ট্রাপ৩ টেবিল (Bootstrap3 Table)

বুটস্ট্রাপ সাধারণ/বেসিক টেবিল

বেসিক বুটস্ট্রাপ টেবিলের মধ্যে হালকা প্যাডিং থাকে এবং টেবিলের সারিগুলোর মধ্যে অনুভুমিক ডিভাইডার থাকে।

বেসিক/সাধারণ বুটস্ট্রাপ টেবিল তৈরি করার জন্য < table > এলিমেন্টের মধ্যে .table অন্তর্ভুক্ত করুনঃ

kt_satt_skill_example_id=816

একনজরে বুটস্ট্রাপ টেবিল সংক্রান্ত ক্লাসসমূহ

ক্লাসবর্ণনা
.tableযেকোনো এলিমেন্টে বেসিক স্টাইল (হালকা প্যাডিং এবং শুধুমাত্র অনুভূমিক ডিভাইডার) যুক্ত করে। 'র সারিতে zebra-striping যুক্ত করে (IE8 এ সাপোর্ট করে না)।
.table-striped
.table-borderedটেবিল এবং সেলের চারপাশে বর্ডার যুক্ত করে।
.table-hoverটেবিলের সারিতে হোভার ইফেক্ট যুক্ত করার জন্য ব্যবহার করা হয়।
.table-condensedটেবিলের সেলের প্যাডিং অর্ধেক করার জন্য ব্যবহার করা হয়।

বুটস্ট্রাপ ডোরাকাটা(Striped) সারি

টেবিলের সারিগুলোকে ডোরাকাটা বা Striped করার জন্য .table ক্লাসের পাশাপাশি .table-striped ক্লাসটি ব্যবহার করুনঃ

kt_satt_skill_example_id=817


বুটস্ট্রাপ বর্ডারযুক্ত টেবিল

টেবিল এবং টেবিল সেলের চারপাশে বর্ডারযুক্ত করার জন্য .table-bordered ক্লাস ব্যবহার করুনঃ

kt_satt_skill_example_id=818


বুটস্ট্রাপ হোভারযুক্ত সারি

টেবিলের সারিগুলোর মধ্যে হোভার ইফেক্ট সক্রিয় করার জন্য .table-hover ক্লাসটি ব্যবহার করুনঃ

kt_satt_skill_example_id=819


বুটস্ট্রাপ কনডেন্সড টেবিল

টেবল সেলের প্যাডি কমানোর জন্য .table-condensed ক্লাস ব্যবহার করুন। এটি প্রায় অর্ধেক প্যাডিং কমিয়ে ফেলেঃ

kt_satt_skill_example_id=820


বুটস্ট্রাপ কনটেকচুয়াল ক্লাস

টেবিলের সারি অথবা সেলে কালার করার জন্য কনটেকচুয়াল ক্লাস ব্যবহার করা যায়। (< tr >) (< td >):

নোটঃ কনটেকচুয়াল কালারের বাহিরে অন্য কালারগুলো ব্যবহার করার জন্য সিএসএস ব্যবহার করুন।

kt_satt_skill_example_id=821

বুটস্ট্রাপ কনটেকচুয়াল ক্লাসগুলির বর্ণনা নিচে দেওয়া হলোঃ

ক্লাসবর্ণনা
.activeটেবিলের সারি অথবা টেবিলের সেলে হোভার কালার যুক্ত করে।
.successএকটি সফল অথবা পজিটিভ কর্মকে নির্দেশ করে।
.infoএকটি নিরপেক্ষ তথ্য পরিবর্তন অথবা নিরপেক্ষ তথ্যকে নির্দেশ করে।
.warningমনোযোগ আকর্শন করার ক্ষেত্রে এটি সাধারনত ব্যবহার করা হয়।
.dangerবিপজ্জনক অথবা নেগেটিভ কর্মকে নির্দেশ করে।


বুটস্ট্রাপ রেসপন্সিভ টেবিল

টেবিলকে রেসপন্সিভ করার জন্য .table-responsive ক্লাসটি ব্যবহার করুন। রেসপন্সিভ টেবিলের ক্ষেত্রে টেবিলটির জন্য ছোট ডিভাইসে(786px এর কম) একটি আনুভূমিক স্ক্রলিং বার হবে, কিন্তু বড় স্ক্রিনের(786px এর বেশি) ক্ষেত্রে কোন পার্থক্যই দেখা যায় নাঃ

kt_satt_skill_example_id=822

এছাড়াও সারি এবং সেলের মধ্যে যেসকল ক্লাস ব্যবহার করা যায়ঃ

ক্লাসবর্ণনা
.activeসংশ্লিষ্ট সারি অথবা সেলে হোভার কালার যুক্ত করে।
.successসফল বা পজিটিভ অ্যাাকশন নির্দেশ করে।
.infoএকটি নিরপেক্ষ অ্যাাকশন নির্দেশ করে।
.warningসতর্কতা নির্দেশ করে।
.dangerবিপদজ্জনক কোন সংকেত বুঝাতে ব্যবহার করা হয়।
Content added || updated By

আরও দেখুন...

Promotion