কিভাবে Tailwind এ একটি ব্লক-স্তরের ফ্লেক্স কন্টেইনার তৈরি করবেন?

• • ' ফ্লেক্স ” ক্লাস একটি ব্লক-স্তরের ফ্লেক্স কন্টেইনার তৈরি করতে ব্যবহার করা হয়।
  • ' ফাঁক-২ ” ক্লাস ফ্লেক্সের চাইল্ড উপাদানগুলির মধ্যে ব্যবধানের 2 ইউনিট যোগ করে।
  • ' m-2 ” ক্লাস কনটেইনারের সব দিকে মার্জিনের 2 ইউনিট যোগ করে।
  • ' সীমানা-২ ” ক্লাস 2 ইউনিট প্রস্থ সহ পাত্রে সীমানা যোগ করে।
  • ' বর্ডার-কালো ” ক্লাস সীমানার রঙ কালোতে সেট করে।

শিশু ফ্লেক্স উপাদানগুলিতে:

• • ' bg-হলুদ-500 ” ক্লাস ফ্লেক্স আইটেমের পটভূমিতে একটি হলুদ রঙ প্রয়োগ করে।
  • ' p-4 ” ক্লাস ফ্লেক্স আইটেমগুলির সব দিকে 4 ইউনিটের প্যাডিং যোগ করে।

আউটপুট

উপরের আউটপুটে, সীমানা প্রতিনিধিত্ব করে যে ধারকটি একটি ব্লক-স্তরের ফ্লেক্স ধারক, যা তার মূল উপাদান (ব্রাউজার) এর সম্পূর্ণ প্রস্থ দখল করে।

বিকল্পভাবে, ব্যবহারকারী ওয়েব পৃষ্ঠায় ফ্লেক্স কন্টেইনার উপাদান পরিদর্শন করে এটি নিশ্চিত করতে পারেন:

উপরের আউটপুটটি নির্দেশ করে যে ধারকটি একটি ব্লক-স্তরের ফ্লেক্স ধারক।

উপসংহার:

Tailwind-এ একটি ব্লক-লেভেল ফ্লেক্স কন্টেইনার তৈরি করতে, এটি যোগ করতে হবে ' ফ্লেক্স ” নির্দিষ্ট ধারক সহ ইউটিলিটি ক্লাস এবং এর চাইল্ড উপাদানগুলি নির্দিষ্ট করুন। ব্যবহারকারীরা তাদের প্রয়োজন অনুসারে ফ্লেক্স আইটেমগুলি সংজ্ঞায়িত এবং সংশোধন করতে পারে। যাচাইকরণের জন্য, ধারকটিতে সীমানা যোগ করুন এবং ওয়েব পৃষ্ঠাটি দেখুন বা ওয়েব পৃষ্ঠায় সেই উপাদানটি পরিদর্শন করুন৷ এই নিবন্ধটি Tailwind-এ একটি ব্লক-স্তরের ফ্লেক্স কন্টেইনার তৈরি করার পদ্ধতি ব্যাখ্যা করেছে।