পাঠ্যসূচী সুপারিশ

Bootstrap 5 সতর্কতা

সতর্কতা

Bootstrap 5 একটি প্রকল্পীকৃত সতর্কতা বার্তা তৈরির জন্য একটি সহজ পদ্ধতি প্রদান করে:

  • সতর্কতা বার্তা বার্তা .alert ক্লাস দ্বারা তৈরি হয়, পরের কোনো কনটেক্স্ট ক্লাসের সাথে:
  • .alert-success
  • .alert-info
  • .alert-warning
  • .alert-danger
  • .alert-primary
  • .alert-secondary
  • .alert-light

উদাহরণ

<div class="alert alert-success">
  <strong>সফল!</strong> এই সতর্কতা বার্তা বার্তা সফল বা ইতিবাচক কাজকর্মকে ইঙ্গিত করে
</div>

আপনার নিজেই প্রয়াস করুন

.alert-dark

সতর্কতা লিঙ্ক .alert-link সতর্কতা বার্তার ভিতরের কোনো লিঙ্কে ক্লাস যোগ করতে পারেন, তাহলে 'মাটির রঙের লিঙ্ক' তৈরি করতে পারেন:

উদাহরণ

<div class="alert alert-success">
  <strong>সফল!</strong> আপনি এই বার্তা পড়ার উচিত <a href="#" class="alert-link">এখানে</a>。
</div>

আপনার নিজেই প্রয়াস করুন

সতর্কতা বিলুপ্ত

যদি সতর্কতা বার্তা বিলুপ্ত করতে হয়, তবে .alert-dismissible সতর্কতা কনটেন্টার ক্লাস যোগ করুন। তবে, class="btn-close" এবং data-bs-dismiss="alert" লিঙ্ক বা বাটন ইলেকট্রনমেন্টে যোগ করুন (যখন আপনি তা ক্লিক করেন, সতর্কতা বার্তা বিলুপ্ত হবে)。

উদাহরণ

<div class="alert alert-success alert-dismissible">
  <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
  <strong>সফল!</strong> এই সতর্কতা বার্তা বার্তা সফল বা ইতিবাচক কাজকর্মকে ইঙ্গিত করে
</div>

আপনার নিজেই প্রয়াস করুন

সতর্কতা বার্তা এনিমেশন

.fade এবং .show সমাপ্ত সতর্কতা বার্তা ফ্লাইন এবং ফ্লাউট ইফেক্ট যোগ করতে ক্লাস যোগ করুন:

উদাহরণ

<div class="alert alert-danger alert-dismissible fade show">

আপনার নিজেই প্রয়াস করুন