What are the tags used to implement drop-down lists in html5-Front-end Q&A-php.cn

What are the tags used to implement drop-down lists in html5

青灯夜游

Release： 2021-12-15 18:22:33

Original

9197 people have browsed it

html5 implements drop-down list tags such as "<select>" and "<option>", and the syntax is "<select><option>list option value..."; the select tag is used to build the drop-down list frame, and the option tag is used to define the list options.

What are the tags used to implement drop-down lists in html5

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

In HTML5, if you want to implement a drop-down list, you need to use <select></select> and <option></option> together. Syntax:

<select>
    <option>列表选项值</option>
    .....
</select>

Copy after login

Among them, the <select> tag is used to create a drop-down list, and the <option> tag represents each item (entry) in the drop-down list.

Example:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>

	<body>
			喜欢的水果：
			<select>
				<option>请选择选项</option>
				<option>苹果</option>
				<option>梨子</option>
				<option>桃子</option>
				<option>香蕉</option>
				<option>李子</option>
				<option>菠萝</option>
				<option>榴莲</option>
			</select>
	</body>
</html>

Copy after login

What are the tags used to implement drop-down lists in html5

It can be seen that the drop-down list will display the first item first by default, so what if a certain item is pre-selected? You can use the selected attribute of the <option> tag.

After setting the selected attribute for the <select> tag, you can pre-select an item through selected="selected" of the <option> tag. The specific usage method is as follows:

喜欢的水果：
<select>
	<option>请选择选项</option>
	<option>苹果</option>
	<option>梨子</option>
	<option>桃子</option>
	<option selected="selected">香蕉</option>
	<option>李子</option>
	<option>菠萝</option>
	<option>榴莲</option>
</select>

Copy after login

What are the tags used to implement drop-down lists in html5

Recommended tutorial: "html video tutorial"

The above is the detailed content of What are the tags used to implement drop-down lists in html5. For more information, please follow other related articles on the PHP Chinese website!