DONATE  
MENU
CSS
MYSQL
AJAX
JAVASCRIPT
JSON
PHP
HTML

HTML Tutorials

INTRODUCTION

» Introduction to HTML

» PRACTICE IT Editor

» Getting Started

» HTML Example

» HTML Tags

» HTML Elements

» Nesting Tags

» Block & Inline Elements

» HTML Attributes

» HTML Comments

» File Paths

» HTML Entities & Symbols

TAGS/ELEMENTS

» Important Tags

» HTML Headings

» Text Formatting

» HTML Links

» HTML Lists

» HTML Tables

» HTML Images

» HTML Audios

» HTML Videos

» HTML Iframes

» HTML Styles

» HTML Scripts

» Semantic Elements

» HTML Metadata

ATTRIBUTES

» Elements' ID

» Elements' Class

» Elements' Style

» Element's Align

» Element's Height & Width

HTML FORMS

» HTML Forms

» Input Elements

» HTML Textarea

» HTML Select

HTML EXAMPLE

» Login Page

.. » HTML » Html Forms » HTML Select
Share Tweet WhatsApp

HTML Select

The HTML <select> tag is used in creating an element containing a list of options which when clicked upon allows a user to select a value from such options. A select element is equivalent or synonymous to radio buttons but unlike radio buttons, it doesn't display all its options until when clicked upon. Creating a select element starts with the declaration of the <select> tag, followed by the individual options contained in the <option> tag. Elements created with the <select> tag just like most form elements are inline - block elements. EXAMPLE
<select>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
<select>
<option value='male'>Male</option>
<option value='female'>Female</option>
</select>

Copy PRACTICE IT

SELECT'S DEFAULT OPTION You can specify a default value or option for a select element using the "selected" attribute. The attribute doesn't accept any value.
<select>
<option value='rice'>Rice</option>
<option value='beans'>Beans</option>
<option value='pizza'>Pizza</option>
<option value='fruits' selected>Fruits</option>
</select>

Copy PRACTICE IT

From the above, you can see that even though the option, "Fruit" is the last option, yet it is the default value. SUMMARY
  1. The <select> tag helps us create a list of options a web user can select a value from.
  2. It is similar to radio buttons since they both allow a user select an option from a list but differ since the element will not display all its options until when clicked upon.
  3. All options of a select element are nested inside it with the <option> tag.
  4. We can specify a default value using the selected attribute on any of the select options. The attribute shouldn't have a value.
Take a short quiz on HTML Select.
Ask a question or tell us if HTML Select is easy or not.
cent?

Join our 1,090 subscribers to receive tutorials' updates!

  We won't spam your mail box. We hate it.





StackBeginner 2021 © Joseph Omamode