বুটস্ট্রাপ বাটন স্টাইল

বুটস্ট্রাপে সাত ধরনের বাটন স্টাইল রয়েছে।

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

1. .btn-default
2. .btn-primary
3. .btn-success
4. .btn-info
5. .btn-warning
6. .btn-danger
7. .btn-link

নিচের উদাহরনে বিভিন্ন বাটন স্টাইলের কোড দেখানো হয়েছেঃ

kt_satt_skill_example_id=914

< a >, < button >, অথবা এলিমেন্টে বাটন ক্লাসগুলো ব্যবহার করা যায়ঃ

kt_satt_skill_example_id=915

বাটনের আকার

বুটস্ট্রাপে চার আকারের বাটন রয়েছে। নিচের উদাহরণে বিভিন্ন আকারের বাটন দেখানো হলোঃ

নিচের ক্লাসগুলো দ্বারা ভিন্ন ভিন্ন আকারের বাটন বুঝায়ঃ

1. .btn-lg
2. .btn-md
3. .btn-sm
4. .btn-xs

নিচের উদাহরনে বিভিন্ন আকারের বাটনের কোড দেখানো হয়েছেঃ

kt_satt_skill_example_id=917

ব্লক লেভেল বাটন

ব্লক লেভেল বাটন প্যারেন্ট এলিমেন্টের সমগ্র অংশ জুড়ে থাকে।

ব্লক লেভেল বাটন তৈরি করার জন্য .btn ক্লাসের সাথে .btn-block ক্লাস ব্যবহার করা হয়ঃ

kt_satt_skill_example_id=919

সক্রিয়/নিষ্ক্রিয় বাটন

বাটনকে সক্রিয় বা নিষ্ক্রিয় ভাবে সেট করা যায়। এখানে নিষ্ক্রিয় বলতে বুঝানো হয়েছে যেই বাটনে ক্লিক করা যায় না।

.active ক্লাস ব্যবহার করে বাটনকে সক্রিয় ভাবে সেট করা হয় এবং .disabled ক্লাস ব্যবহার করে নিষ্ক্রিয় ভাবে বাটন সেট করা হয়ঃ

kt_satt_skill_example_id=921

একনজরে বাটন সংক্রান্ত ক্লাসগুলো দেখে নেইঃ

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

ক্লাস	বর্ণনা
.btn	যেকোন বাটনে বেসিক স্টাইল যুক্ত করে।
.btn-default	ডিফল্ট/স্ট্যান্ডার্ড বাটন তৈরি করে।
.btn-primary	প্রাইমারি একশন নির্দেশ করে।
.btn-success	একটি সফল বা হ্যাঁ-বোধক কাজকে নির্দেশ করে।
.btn-info	তথ্য সরবরাহকৃত ম্যাসেজ দেখানোর জন্য ব্যবহার করা হয়।
.btn-warning	বিপদজনক কিছু হতে পারে, এরকম বুঝায়।
.btn-danger	বিপদজনক অথবা না-বোধক কিছু বুঝায়।
.btn-link	একটি বাটনকে লিঙ্কের মত দেখাবে (কিন্তু আচরন বাটনের মতই হবে)।
.btn-lg	বড় আকৃতির বাটন তৈরি করার জন্য ব্যবহার করা হয়।
.btn-sm	ছোট আকৃতির বাটন তৈরি করার জন্য ব্যবহার করা হয়।
.btn-xs	অতিরিক্ত ছোট আকারের বাটন তৈরি করার জন্য ব্যবহার করা হয়।
.btn-block	একটি ব্লক-লেবেল বাটন তৈরি করে (প্যারেন্ট এলিমেন্টের সম্পূর্ন প্রস্থ নিয়ে নেয়)।
.active	বাটনটি প্রেস করা অবস্থায় রয়েছে দেখাবে।
.disabled	বাটনকে ডিজেবল করে রাখবে।