HTML | DOM Select size Property
The Select size property is used to set or return the value of the size attribute of a drop-down list. The Select size attribute is generally used to specify the number of visible options in a drop-down list.
Syntax:
- For returning the size property:
selectObject.size
- For setting the size property:
selectObject.size = number
Property Values
- number :It is used to specify the number of visible options in a drop-down list.
Return Values: It returns a numeric value which represents the number of visible options in a drop-down list.
Below program illustrates the Select size property :
Example: Changing the number of visible options in a drop-down list.
html
<!DOCTYPE html> < html > < head > < title > Select size Property in HTML </ title > < style > h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </ style > </ head > < body > < h1 > w3wiki </ h1 > < h2 > Select size Property </ h2 > < br > Select your preferred course from the drop-down list: < br > < select name = "Courses Titles" id = "myCourses" > < option value = "C++" >c++</ option > < option value = "Placement" >Placement</ option > < option value = "Java" >Java</ option > < option value = "Python" >Python</ option > </ select > < p >To change the number of visible options in the dropdown list., double-click the "Change Number" button.</ p > < button ondblclick = "My_list()" > Change Number </ button > < script > function My_list() { document.getElementById("myCourses").size = "2"; } </ script > </ body > </ html > |
Output:
Before clicking the button:
After clicking the button:
Supported Browsers:
- Apple Safari 3 and above
- Edge 12 and above
- Firefox 1 and above
- Google Chrome 1 and above
- Opera 12.1 and above
Contact Us