برچسب <select> HTML

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

<select> عنصر برای ایجاد لیست کشویی استفاده می‌شود.

<select> عنصر به طور معمول در فرم‌ها استفاده می‌شود، برای جمع‌آوری ورودی کاربران.

پس از ارسال فرم، باید از ویژگی name برای ارجاع به داده‌های فرم استفاده شود (اگر ویژگی name را حذف کنید، داده‌های لیست کشویی ارسال نمی‌شوند).

<select> درون عنصر برچسب <option> تعریف گزینه‌های موجود در لیست کشویی.

برای ارتباط لیست کشویی با برچسب (label) باید از ویژگی id استفاده کنید.

نکته:همیشه اضافه کنید <label> برچسب برای بهبود عملکرد دسترسی بهتر به کار ببرید!

لطفاً به:

دستورالعمل HTML DOM:موضوع Select

آموزش CSS:تنظیم استایل فرم

مثال

مثال 1

یک لیست کشویی شامل چهار گزینه ایجاد کنید:

<label for="cars">لطفاً یک برند خودرو انتخاب کنید：</label>
<select name="cars" id="cars">
  <option value="audi">آوودی</option>
  <option value="byd">بی‌یان‌دای</option>
  <option value="geely">جلیان</option>
  <option value="volvo">ولوو</option>
</select>

به طور مستقیم امتحان کنید

مثال 1

مثال 2 <select> با استفاده از برچسب <optgroup> استفاده کنید:

<label for="cars">لطفاً یک برند خودرو انتخاب کنید：</label>
<select name="cars" id="cars">
  <optgroup label="ماشین‌های چینی">
    <option value="byd">بی‌یان‌دای</option>
    <option value="geely">جلیان</option>
  </optgroup>
  <optgroup label="ماشین‌های آلمانی">
    <option value="mercedes">مرسدس</option>
    <option value="audi">آوودی</option>
  </optgroup>
</select>

به طور مستقیم امتحان کنید

ویژگی

ویژگی مقدار توضیحات
autofocus autofocus محدودیت قرار دادن لیست کشویی را در زمان بارگذاری صفحه به صورت خودکار فعال کنید.
disabled disabled محدودیت قرار دادن لیست کشویی را غیرفعال کنید.
form id فرم تعریف فرم مربوط به لیست کشویی.
multiple multiple ممکن است چندین گزینه را یکجا انتخاب کنید.
name نام نام لیست کشویی را تعریف می‌کند.
required required محدد می‌کند که کاربر باید یک مقدار انتخاب کند قبل از ارسال فرم.
size عدد تعداد گزینه‌های قابل مشاهده در لیست کشویی را تعریف می‌کند.

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

<select> برچسب‌ها همچنین از ویژگی‌های جهانی در HTML.

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

<select> برچسب‌ها همچنین از ویژگی‌های رویداد در HTML.

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

بدون

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

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