تگ Select , Option , Optgroup

تگ select

در این بخش از آموزش Html  ، تگ Optgroup , تگ Option و تگ Select را به شما آموزش می دهیم.

در این تگ برای اضافه کردن drop-down استفاده می شود.دراین تگ برای ایجاد یک منوی کشویی که دارای چند گزینه می باشد استفاده می باشد.تگoption از زیرمجموعه های تگ select می باشد و با استفاده از آن می توان قابلیت هایی را به وب سایت اضافه کرد.

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

 <select>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”mercedes”>Mercedes</option>
<option value=”audi”>Audi</option>
</select>

تگ option 

از تگ option برای ایجاد گزینه هایی که در لیست نمایش داده میشود استفاده می کنیم.این تگ داخل تگ های select قرار گرفته است همچنین این تگ را ویژگی های عمومی در html را پشتیبانی می کند.

مثال زیر کاربرد تگ option را در طراحی سایت نشان می دهد.

<select>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”opel”>Opel</option>
<option value=”audi”>Audi</option>
</select>

تگ optgroup

از تگ optgroup برای ایجاد تعدادی از option ها در یک drop-down استفاده می شود.در صورتی که گزینه های موجود در لیست شما زیاد باشد می توانید از این تگ استفاده کنید.

مثال زیر کاربرد تگ optgroup را در بخش طراحی سایت نشان می دهد.

<select>
<optgroup label=”Swedish Cars”>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
</optgroup>
<optgroup label=”German Cars”>
<option value=”mercedes”>Mercedes</option>
<option value=”audi”>Audi</option>
</optgroup>
</select>

منبع: sitedesign-co.com