লেআউট জন্য ইউটিলিটি

দ্রুত মোবাইল-বন্ধুত্বপূর্ণ এবং প্রতিক্রিয়াশীল বিকাশের জন্য, বুটস্ট্র্যাপ কন্টেন্ট দেখানো, লুকিয়ে রাখা, সারিবদ্ধ করা এবং ফাঁক করার জন্য কয়েক ডজন ইউটিলিটি ক্লাস অন্তর্ভুক্ত করে।

পরিবর্তন হচ্ছেdisplay

সম্পত্তির সাধারণ মানগুলিকে প্রতিক্রিয়াশীলভাবে টগল করার জন্য আমাদের ডিসপ্লে ইউটিলিটিগুলিdisplay ব্যবহার করুন ৷ নির্দিষ্ট ভিউপোর্ট জুড়ে দেখানো বা লুকানোর জন্য আমাদের গ্রিড সিস্টেম, বিষয়বস্তু বা উপাদানগুলির সাথে এটি মিশ্রিত করুন।

ফ্লেক্সবক্স বিকল্প

বুটস্ট্র্যাপ 4 ফ্লেক্সবক্স দিয়ে তৈরি করা হয়েছে, কিন্তু প্রতিটি উপাদান displayপরিবর্তন করা হয়নি display: flexকারণ এটি অনেক অপ্রয়োজনীয় ওভাররাইড যোগ করবে এবং অপ্রত্যাশিতভাবে মূল ব্রাউজার আচরণ পরিবর্তন করবে। আমাদের বেশিরভাগ উপাদান ফ্লেক্সবক্স সক্ষম সহ নির্মিত।

display: flexআপনার যদি কোনো উপাদান যোগ করার প্রয়োজন হয় .d-flex, তাহলে প্রতিক্রিয়াশীল ভেরিয়েন্টের (যেমন, .d-sm-flex) সাথে তা করুন। সাইজিং, অ্যালাইনমেন্ট, স্পেসিং এবং আরও অনেক কিছুর displayজন্য আমাদের অতিরিক্ত ফ্লেক্সবক্স ইউটিলিটি ব্যবহারের অনুমতি দিতে আপনার এই শ্রেণী বা মানটির প্রয়োজন হবে ।

মার্জিন এবং প্যাডিং

উপাদান এবং উপাদানগুলি কীভাবে ব্যবধান এবং আকার করা হয় তা নিয়ন্ত্রণ করতে marginএবং padding ব্যবধানের ইউটিলিটিগুলি ব্যবহার করুন । বুটস্ট্র্যাপ 4 একটি 1remমান ডিফল্ট $spacerভেরিয়েবলের উপর ভিত্তি করে ব্যবধান ইউটিলিটিগুলির জন্য একটি পাঁচ-স্তরের স্কেল অন্তর্ভুক্ত করে। সমস্ত ভিউপোর্টের জন্য মান চয়ন করুন (যেমন, এর .mr-3জন্য margin-right: 1rem), বা নির্দিষ্ট ভিউপোর্টগুলিকে লক্ষ্য করার জন্য প্রতিক্রিয়াশীল রূপগুলি বেছে নিন (যেমন, ব্রেকপয়েন্ট থেকে শুরু করার .mr-md-3জন্য )।margin-right: 1remmd

টগলvisibility

যখন টগল displayকরার প্রয়োজন হয় না, আপনি আমাদের দৃশ্যমানতা ইউটিলিটিগুলিরvisibility সাথে একটি উপাদানের টগল করতে পারেন ৷ অদৃশ্য উপাদানগুলি এখনও পৃষ্ঠার বিন্যাসকে প্রভাবিত করবে, কিন্তু দর্শনার্থীদের থেকে দৃশ্যত লুকানো থাকে৷