SNDP BAG 4 YOU
কম্পিউটার প্রোগ্রামিং শিখুন


Bootstrap Split Button


Bootstrap split বাটন তৈরি করার জন্য প্রথমে দুটি বাটন এর প্রয়োজন ও এর সঙ্গে কিছু ক্লাসএর প্রয়োজন যে গুলো নিচে আলোচনা করা হয়েছে ।

.btn-group - অনেক গুলো বাটনকে একসঙ্গে গ্রুপ তৈরি করা হয় এই ক্লাস এর দ্বারা । একটি মূল div ট্যাগের ভিতের ক্লাস হিসাবে লিখতে হয় ।

.btn btn-warning - বাটন ও বাটন এর ব্যাকগ্রাউন্ড রং নিয়ে আসার জন্য এই ক্লাস ব্যবহার করা হয় ।

.dropdown-toggle- বাটনে এই রকম আইকন নিয়ে আসার জন্য এই ক্লাসটি ব্যবহার করা হয় । বাটন ক্লাসএর ভিতরে লিখতে হয়।

.dropdown-toggle-split- বাটনটি একটু ছোট ও বাটনকে Split বা দুই ভাগে বিভক্ত করতে এই ক্লাস ব্যবহার করা হয় ।




Split Dropdown Button with code



.dropdown - যে লিস্ট তৈরি হবে সেটি নিচের দিকে দেখাবে এর জন্য এই ক্লাসটি ব্যবহার করা হয় ।

.dropup - যে লিস্ট তৈরি হবে সেটি উপরের দিকে দেখাবে এর জন্য এই ক্লাসটি ব্যবহার করা হয় ।

.dropdown-toggle - বাটনে এই রকম আইকন নিয়ে আসার জন্য এই ক্লাসটি ব্যবহার করা হয় । বাটন ক্লাসএর ভিতরে লিখতে হয় ।

.btn btn-warning- বাটন ও বাটন এর রং নিয়ে আসার জন্য এই ক্লাসটি ব্যবহার করা হয় । বাটন ক্লাসএর ভিতরে লিখতে হয় ।

data-toggle="dropdown" - এই attributes ব্যবহার করা হয় যখন বাটনে কেউ ক্লিক করবে তখনি লিস্ট টি নিজে থেকে খুলে যাবে । বাটন ট্যাগএর ভিতরে লিখতে হয় ।

.dropdown-menu - এই ক্লাসটি ব্যবহার করা হয় লিস্টটি লুকিয়ে (hide)রাখার জন্য । এই ক্লাস টি একটি div এর ভিতরে ব্যবহার করা হয় ।

dropdown-item - এই ক্লাসটি ব্যবহার করা হয় লেখা (text) গুলো নিচে নিচে দেখানো জন্য । লিস্ট ট্যাগ এর ক্লাসে লিখতে হয় ।


Right Side Icon Button



.dropright - বাটনে এই রকম আইকন নিয়ে আসার জন্য এই ক্লাসটি ব্যবহার করা হয় । এই আইকনটি ডান দিকে দেখাবে ।




Right side Dropdown list button






Left side Drop list Button


.dropleft - বাটনে এই রকম বামদিকে আইকন নিয়ে আসার জন্য এই ক্লাসটি ব্যবহার করা হয় । এই আইকনটি বাম দিকে দেখাবে ।




Project Button



Project Button 2





Project Button 3