خانه آموزش HTML آموزش تگ های HTML آموزش تگ fieldset در HTML

آموزش تگ fieldset در HTML

توسط

۱۳۹۸-۰۱-۰۳

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ fieldset در HTML با من همراه باشید.

آموزش تگ fieldset در HTML

Free-Learn

تگ Fieldset در HTML

تگ fieldset تگی است که با استفاده از آن میتوان عناصر ( تگ ) های موجود در یک فرم را گروه بندی (دسته بندی) نمود.

Free-Learn

مثال از تگ fieldset در HTML

در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.

<body>

<form>
  <fieldset>
    <legend>اطلاعات شخصی</legend>
    نام: <input type="text"><br>
    فامیلی: <input type="text"><br>
  </fieldset>
</form> 

</body>

<body>

<form>

<legend>اطلاعات شخصی</legend>

نام: <input type="text"><br>

فامیلی: <input type="text"><br>

</fieldset>

</form>

</body>

امتحان کنید

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ fieldset در HTML پشتیبانی میکنند یا خیر.

نام مرورگر	Chrome	Firefox	Opera	Safari	IE
پشتیبانی	بله	بله	بله	بله	بله

Free-Learn

جدول صفات تگ fieldset در HTML

در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.

(علامت یعنی در HTML5 اضافه شده است)

نام صفت	مقدار	توضیح
disabled	disabled	این صفت تمامی عناصر موجود در تگ fieldset را غیرفعال میکند.()
form	form_id	مشخص میکند که تگ fieldset متعلق به یک یا چندین فرم می باشد. ()
name	text	یک نام برای تگ fieldset مشخص میکند. ()

Free-Learn

پشتیبانی از صفات و رویدادهای عمومی

تگ fieldset از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.

Free-Learn

نکات و توضیحات

با استفاده از تگ <legend> میتوانیم یک عنوان/کپشن برای تگ fieldset مشخص نماییم.

Free-Learn

دستورات CSS پیش فرض

معمولا مرورگرها تگ fieldset را بصورت پیش فرض با دستورات CSS زیر نمایش میدهند.

fieldset {
  display: block;
  margin-left: 2px;
  margin-right: 2px;
  padding-top: 0.35em;
  padding-bottom: 0.625em;
  padding-left: 0.75em;
  padding-right: 0.75em;
  border: 2px groove (internal value);
}

fieldset {

display: block;

margin-left: 2px;

margin-right: 2px;

padding-top: 0.35em;

padding-bottom: 0.625em;

padding-left: 0.75em;

padding-right: 0.75em;

border: 2px groove (internal value);

}