HTML <legend> ট্যাগ

  • পূর্ববর্তী পৃষ্ঠা <label>
  • পরবর্তী পৃষ্ঠা <li>

বর্ণনা ও ব্যবহার

<legend> ট্যাগ নির্দিষ্ট <fieldset> এলিমেন্ট শিরোনাম (ক্যাপশন)।

আরও দেখুন:

HTML DOM রেফারেন্স ম্যানুয়াল:লেগেন্ড অবজেক্ট

উদাহরণ

উদাহরণ 1

ফর্মে সংশ্লিষ্ট উপাদানগুলোকে গ্রুপ করা:

<form action="/action_page.php">
  <fieldset>
    <legend>ব্যক্তিগত তথ্য:</legend>
    <label for="fname">নাম:</label>
    <input type="text" id="fname" name="fname"><br><br>
    <label for="lname">পরিবারনাম:</label>
    <input type="text" id="lname" name="lname"><br><br>
    <label for="email">ইমেইল:</label>
    <input type="email" id="email" name="email"><br><br>
    <label for="birthday">জন্মদিন:</label>
    

<input type="date" id="birthday" name="birthday"><br><br> <input type="submit" value="প্রদান করুন"> </fieldset>

স্বয়ং প্রয়াস করুন

উদাহরণ 2

ফিল্ডসেট শিরোনামকে ডানদিকে ফ্লোট করানো (সিএসএস ব্যবহার করে):

<form action="/action_page.php">
  <fieldset>
    <legend style="float:right">ব্যক্তিগত তথ্য:</legend>
    <label for="fname">নাম:</label>
    <input type="text" id="fname" name="fname"><br><br>
    <label for="lname">পরিবারনাম:</label>
    <input type="text" id="lname" name="lname"><br><br>
    <label for="email">ইমেইল:</label>
    <input type="email" id="email" name="email"><br><br>
    <label for="birthday">জন্মদিন:</label>
    

<input type="date" id="birthday" name="birthday"><br><br> <input type="submit" value="প্রদান করুন"> </fieldset>

স্বয়ং প্রয়াস করুন

উদাহরণ 3

সিএসএস দ্বারা সেট করা: <fieldset> এবং <legend> স্টাইল:

<html>
<head>
<style>
fieldset {
  background-color: #eeeeee;
}
legend {
  background-color: gray;
  color: white;
  padding: 5px 10px;
}
input {
  margin: 5px;
}
</style>
</head>
<body>
<form action="/action_page.php">
  <fieldset>
    <legend>ব্যক্তিগত তথ্য:</legend>
    <label for="fname">নাম:</label>
    <input type="text" id="fname" name="fname"><br><br>
    <label for="lname">পরিবারনাম:</label>
    <input type="text" id="lname" name="lname"><br><br>
    <label for="email">ইমেইল:</label>
    <input type="email" id="email" name="email"><br><br>
    <label for="birthday">জন্মদিন:</label>
    

<input type="date" id="birthday" name="birthday"><br><br> <input type="submit" value="প্রদান করুন"> </fieldset> </form> </body>

স্বয়ং প্রয়াস করুন

</html>

<legend> ট্যাগটি ইভেন্ট অ্যাট্রিবিউটসও সমর্থন করে গ্লোবাল অ্যাট্রিবিউট

HTML-তে গ্লোবাল অ্যাট্রিবিউট

<legend> ট্যাগটি ইভেন্ট অ্যাট্রিবিউটসও সমর্থন করে HTML-তে ইভেন্ট অ্যাট্রিবিউট

ডিফল্ট সিএসএস সেটিং

অধিকাংশ ব্রাউজার নিম্নলিখিত ডিফল্ট মান ব্যবহার করবে <legend> উপাদান:

legend {
  display: block;
  padding-left: 2px;
  padding-right: 2px;
  border: none;
}

স্বয়ং প্রয়াস করুন

ব্রাউজার সমর্থন

চ্রোম এজ ফায়ারফক্স স্যাফারি অপেরা
চ্রোম এজ ফায়ারফক্স স্যাফারি অপেরা
সমর্থন সমর্থন সমর্থন সমর্থন সমর্থন
  • পূর্ববর্তী পৃষ্ঠা <label>
  • পরবর্তী পৃষ্ঠা <li>