تگ fieldset در html

تگ fieldset برای گروه‌بندی مجموعه‌ای از فیلدهای فرم استفاده می‌شود. این تگ با استفاده از <legend> می‌تواند عنوانی برای آن گروه نمایش دهد و ظاهر بصری و معنایی مشخص‌تری به فرم ببخشد.

نحوه استفاده از تگ <fieldset>

درون تگ <fieldset> معمولاً فیلدهای مرتبط قرار می‌گیرند و در بالای آن از تگ <legend> برای مشخص کردن عنوان گروه استفاده می‌شود.

<fieldset>
  <legend>اطلاعات شخصی</legend>
  
  <label for="name">نام:</label>
  <input type="text" id="name">

  <label for="email">ایمیل:</label>
  <input type="email" id="email">
</fieldset>

attribute یا ویژگی‌های قابل استفاده در تگ <fieldset>

تگ fieldset فقط از ویژگی disabled (برای غیرفعال کردن تمام فیلدهای داخل) و ویژگی‌های عمومی HTML پشتیبانی می‌کند.

disabled

تمام فیلدهای داخل fieldset را به حالت غیرفعال درمی‌آورد.

<fieldset disabled>
  <legend>غیرفعال شده</legend>
  <input type="text" value="این فیلد غیرفعال است">
</fieldset>

Global Attributes / Event Attributes

تگ <fieldset> از Global و Event Attributes پشتیبانی می‌کند.

ویژگی‌های ظاهری پیشفرض در تگ <fieldset>

تگ <fieldset> به‌صورت باکسی با حاشیه و عنوان در بالا (با استفاده از <legend>) نمایش داده می‌شود.

fieldset {
  border: 1px solid #ccc;
  padding: 1em;
  margin: 1em 0;
}

آموزش خصوصی طراحی سایت و وردپرس به صورت آنلاین

پروژه محور - ارتباط مستقیم با مدرس