এই পোস্টটি আলোচনা করবে যে নর্দমার স্থানগুলি কী এবং বুটস্ট্র্যাপে একটি নির্দিষ্ট ডিভের জন্য কীভাবে সেগুলি সরানো যেতে পারে।
বুটস্ট্র্যাপে গটার স্পেস কি?
নর্দমাগুলি হল অনুভূমিক প্যাডিং দ্বারা উত্পাদিত কলামগুলির মধ্যে শূন্যস্থান বা ফাঁক। এগুলি বুটস্ট্র্যাপ গ্রিড সিস্টেমে প্রতিক্রিয়াশীল সামগ্রী সারিবদ্ধকরণ এবং স্পেস সমর্থন করতে ব্যবহৃত হয়।
নীচে দেওয়া চিত্রটি চারপাশে একটি লাল সীমানা সহ একটি সারি দেখায়। সারির মধ্যে, সমান গ্রিড কলামের তিনটি সমান-আকারের ডিভ উপাদান বিদ্যমান। যদিও কলামগুলি সমান, তবুও তাদের মধ্যে গটার স্পেস রয়েছে:
বুটস্ট্র্যাপে একটি নির্দিষ্ট ডিভের জন্য গটার স্পেস কীভাবে সরানো যায়?
বুটস্ট্র্যাপে, ক্লাস ' নর্দমা ” যেকোন ডিভের নর্দমার স্থানগুলি দূর করতে ব্যবহার করা হয়।
এই উদ্দেশ্যে:
- যুক্ত কর একটি ' 'শ্রেণীর সাথে ট্যাগ' main-div ”
- তারপরে, আরেকটি যোগ করে একটি সারি বিভাগ সামঞ্জস্য করুন '
'শ্রেণীর সাথে উপাদান' সারি ” যেহেতু আমাদের সারি থেকে স্পেসগুলি সরাতে হবে, একটি ক্লাস নির্দিষ্ট করুন “ নর্দমা ' এটার মধ্যে.- গ্রিড সারিটিকে তিনটি সমান কলামে ভাগ করতে, ক্লাসটি ব্যবহার করুন “ col-4 ”
- প্রতিটি কলামের '
' কন্টেইনারের মধ্যে, '' উপাদানগুলিকে ক্লাসের সাথে সামঞ্জস্য করুন কলাম-1 ', ' কলাম-২ ', এবং ' কলাম-৩ ', যথাক্রমে: < div ক্লাস = 'প্রধান-বিভাগ' >
< div ক্লাস = 'সারি কোন নর্দমা' >
< div ক্লাস = 'কল-4' >
< div ক্লাস = 'কলাম-1' < / div >
< / div >
< div ক্লাস = 'কল-4' >
< div ক্লাস = 'কলাম-২' < / div >
< / div >
< div ক্লাস = 'কল-4' >
< div ক্লাস = 'কলাম-3' < / div >
< / div >
< / div >
< / div >সিএসএস
CSS বিভাগে, HTML পৃষ্ঠায় উল্লিখিত ক্লাসগুলি বেশ কয়েকটি স্টাইলিং বৈশিষ্ট্য সহ স্টাইল করা হয়েছে।
স্টাইল 'মেইন-ডিভ' ক্লাস
.main-div {
প্রস্থ : 600px;
মার্জিন: 50px স্বয়ংক্রিয়;
}দ্য ' .main-div ' ক্লাস থাকা div উপাদান অ্যাক্সেস করার জন্য উল্লেখ করা হয়েছে ' main-div ” নিম্নলিখিত বৈশিষ্ট্যগুলি এই শ্রেণীর জন্য প্রয়োগ করা হয়:
- ' প্রস্থ ' উপাদানের প্রস্থ সংজ্ঞায়িত করে।
- ' মার্জিন ” উপাদানের চারপাশে ব্যবধান নির্ধারণ করে।
স্টাইল 'সারি' ক্লাস
সারি {
সীমান্ত : 1px কঠিন লাল;
}বুটস্ট্র্যাপ ' সারি 'শ্রেণীর সাথে যোগ করা হয় ' সীমান্ত 'সম্পত্তি। এটি একটি নির্দিষ্ট প্রস্থ, শৈলী এবং রঙের বর্ডারে গ্রিড সারি মোড়ানো হবে।
তিনটি শ্রেণী ' কলাম-1 ', ' কলাম-২ ', এবং ' কলাম-৩ 'সিএসএস বরাদ্দ করা হয়' পেছনের রং ' এবং ' উচ্চতা ' বৈশিষ্ট্য তাদের বিশিষ্ট করতে.
স্টাইল 'কলাম -1' ক্লাস
.কলাম- এক {
পটভূমি- রঙ : ফিরোজা;
উচ্চতা : 200px;
}স্টাইল 'কলাম -2' ক্লাস
.কলাম- 2 {
পটভূমি- রঙ : বেগুনি;
উচ্চতা : 200px;
}স্টাইল 'কলাম -3' ক্লাস
.কলাম- 3 {
পটভূমি- রঙ : হলুদ সবুজ;
উচ্চতা : 200px;
}লক্ষ্য করা যায় যে '
'শ্রেণীর সাথে পাত্র' সারি ” তাদের মধ্যে কোন নর্দমা স্থান ছাড়া সফলভাবে সমন্বয় করা হয়েছে:
আমরা আপনাকে বুটস্ট্র্যাপে একটি নির্দিষ্ট ডিভের জন্য নর্দমার স্থান সরাতে শিখিয়েছি।
উপসংহার
একটি নির্দিষ্ট ডিভের জন্য নর্দমার স্থানগুলি অপসারণ করতে, ক্লাস ' নর্দমা ' ব্যবহার করা যেতে পারে. এই উদ্দেশ্যে, যোগ করুন '
'এর সাথে উপাদান' সারি কোন নর্দমা 'শ্রেণী। এই পোস্টটি নর্দমার স্থানগুলির উপর একটি বিস্তৃত নির্দেশিকা প্রদান করেছে এবং কীভাবে সেগুলিকে বুটস্ট্র্যাপে একটি নির্দিষ্ট ডিভের জন্য নির্মূল করা যেতে পারে। - তারপরে, আরেকটি যোগ করে একটি সারি বিভাগ সামঞ্জস্য করুন '