آموزش تگ select در HTML

آموزش تگ select در HTML
دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ select در HTML به صورت کامل آشنا بشید.
تگ Select در HTML
تگ select
تگی است که میتوان با استفاده از آن یک لیست کشویی ( لیست بازشو ) را ایجاد کرد، و همچنین با استفاده از تگ Option نیز میتوان آیتم ها و موارد لیست کشویی را تعریف کرد.
مثال از تگ select در HTML
در ادامه آموزش html و css میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : از تگ select برای ایجاد کردن لیست بازشو استفاده می شود( و استفاده از تگ option برای ایجاد آیتم های همان لیست )
<body> <label for="TF">طرفدار کدوم تیمی :</label> <select id="TF" name="tarafdari"> <option value="Esteghlal">استقلال</option> <option value="Persepolis">پرسپولیس</option> <option value="other">تراکتور</option> </select> </body>
مثال شماره ۲ : استفاده از صفت size ( نمایش چند مورد آیتم از لیست )
<select size="3"> ... </select>
راستی اگر دنبال آموزش html css پروژه محور هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید.
مثال شماره ۳ : استفاده از صفت required ( حتما باید حداقل یک آیتم از لیست انتخاب بشه )
<select required> ... </select>
مثال شماره ۲ : لیستی که غیرفعال است و نمی توان ازش استفاده کرد.
<select disabled> ... </select>
در مثال شماره ۳ :استفاده از صفت multiple را فرا میگیریم ( برای انتخاب کردن بیش از ۱ آیتم باید دکمه Ctrl را که روی صفحه کلید واقع است را نگه دارید سپس با ماوس گزینه ها را انتخاب کنید )
<select multiple> ... </select>
پشتیبانی مرورگرها
در جدولی که در پایین مشاهده می کنید به این نتیجه می رسید که آیا مرورگرهای اینترنتی از تگ select
در HTML پشتیبانی میکنند یا خیر.
جدول صفات تگ select در HTML
در جدول زیر میتوانید مشاهده کنید که چه صفات و چه مقادیری را میتوان در این تگ استفاده کرد.
پشتیبانی از صفات و رویدادهای عمومی
تگ select
از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
نکات و توضیحات
- توضیح خاصی برای این تگ وجود ندارد.
شما میتوانید با دوره ی آموزشی html css در این موارد بسیار مهارت پیدا کنید.
در صورتی که مشکلی دارید و قادر به حل آن نیستید می توانید با ما در تماس باشید
دیدگاهتان را بنویسید