HTML <legend> تگ

  • پچھلے پیج <label>
  • آئندہ پہلا پیج <li>

تعریف و استفاده

<لگیند> برچسب تعریف می‌کند <fieldset> عناصر عنوان (caption).

لطفاً به

دستنوشت 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>
</form>

خود کا تجربہ کریں

مثال 2

عنوان جدول‌بندی به سمت راست شناور می‌کند (از طریق CSS استفاده می‌شود):

<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>
</form>

خود کا تجربہ کریں

مثال 3

از طریق CSS تنظیم می‌شود <fieldset> و <لگیند> استایل:

<html>
<head>
<style>
fieldset {
  background-color: #eeeeee;
}
لگیند {
  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>

خود کا تجربہ کریں

عالمی اپنتیوی

<لگیند> تگ کا استعمال HTML میں عالمی اپنتیویہوگا،

واقعیتی اپنتیوی

<لگیند> تگ کا استعمال HTML میں واقعیتی اپنتیویہوگا،

اصل کی سی ایس ایس سی تنظیم

بہترین براؤزرز کا استعمال کی جانے والا اصل مقدار درج ذیل ہوگا <لگیند> عنصر:

لگیند {
  ڈسپلے: بلوک;
  پینڈنگ-لیفت: 2 پیکس;
  پینڈنگ-رائٹ: 2 پیکس;
  بوردر: نہیں;
}

خود کا تجربہ کریں

بھرپائی کا براہ راست

کروم ایج فائرفاکس سافری آپریا
کروم ایج فائرفاکس سافری آپریا
پشتیبندگی پشتیبندگی پشتیبندگی پشتیبندگی پشتیبندگی
  • پچھلے پیج <label>
  • آئندہ پہلا پیج <li>