برچسب <form> HTML

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

<form> برچسب‌ها برای ایجاد فرم HTML برای دریافت ورودی کاربر استفاده می‌شوند.

<form> عناصر می‌توانند یکی از عناصر فرم زیر را شامل شوند:

لطفاً به: مراجعه کنید

تور HTML:فرم و ورودی HTML

دستورالعمل HTML DOM:آبجکت فرم

تور CSS: طراحی استایل فرم

مثال

مثال 1

فرم HTML با دو فیلد ورودی و یک دکمه ارسال:

<form action="/action_page.php" method="get">
  <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>
  <input type="submit" value="ارسال">
</form>

آزمایش کنید

مثال 2

فرم HTML با چک باکس:

<form action="/action_page.php" method="get">
  <input type="checkbox" name="vehicle1" value="Bike">
  <label for="vehicle1">من یک دوچرخه دارم</label><br>
  <input type="checkbox" name="vehicle2" value="Car">
  <label for="vehicle2">من یک ماشین دارم</label><br>
  <input type="checkbox" name="vehicle3" value="Boat" checked>
  <label for="vehicle3">من یک قایق دارم</label><br><br>
  <input type="submit" value="ارسال">
</form>

آزمایش کنید

مثال 3

فرم HTML با گزینه‌های انتخابی:

<form action="/action_page.php" method="get">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="ارسال">
</form>

آزمایش کنید

ویژگی

ویژگی مقدار توضیح
accept-charset charset تعیین می‌کند که کدام کدگذاری برای ارسال فرم استفاده شود.
action URL تعیین می‌کند که داده‌های فرم به کجا ارسال شوند، هنگام ارسال فرم.
autocomplete
  • on
  • off
تعیین می‌کند که آیا فرم باید قابلیت خودکامپلétion را فعال کند یا خیر.
enctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
تعیین می‌کند که چگونه داده‌های فرم باید کدگذاری شوند، هنگام ارسال داده‌های فرم به سرور.
method
  • get
  • post
تعیین می‌کند که کدام روش HTTP برای ارسال داده‌های فرم استفاده شود.
name text تعیین می‌کند که نام فرم چیست.
novalidate novalidate تعیین می‌کند که در هنگام ارسال فرم، فرم نباید بررسی شود.
rel
  • external
  • help
  • license
  • next
  • nofollow
  • noopener
  • noreferrer
  • opener
  • prev
  • search
تعیین می‌کند که ارتباط منبع لینک و مستند جاری چیست.
target
  • _blank
  • _self
  • _parent
  • _top
تعیین می‌کند که پاسخ‌های دریافتی پس از ارسال فرم در کجا نمایش داده شوند.

ویژگی‌های جهانی

<form> برچسب‌ها از پشتیبانی از این رویدادها برخوردارند ویژگی‌های جهانی در HTML.

ویژگی‌های رویداد

<form> برچسب‌ها از پشتیبانی از این رویدادها برخوردارند ویژگی‌های رویداد در HTML.

تنظیمات CSS پیش‌فرض

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <form> عنصر:

form {
  display: block;
  margin-top: 0em;
}

آزمایش کنید

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی