App下載

HTML下拉列表框怎么設(shè)置？下拉列表框默認(rèn)值怎么設(shè)置？

猿友 2021-05-20 10:21:41 瀏覽數(shù) (10373)
反饋

想必細(xì)心地同學(xué)都有發(fā)現(xiàn)，我們?cè)谔顚懕韱螘r(shí)經(jīng)常可以看到一個(gè)控件，那就是下拉列表框，最常見的應(yīng)該就是地區(qū)選擇。那么 HTML 下拉列表框怎么設(shè)置呢？又怎么設(shè)置下拉列表框的默認(rèn)值呢？這篇文章告訴你。

<select></select>標(biāo)簽

HTML 下拉列表框是由?<select></select>?標(biāo)簽顯示的，其中下拉選項(xiàng)內(nèi)容是由?<option></option>?標(biāo)簽控制的。

先讓我們來看下具體實(shí)現(xiàn)效果：

HTML設(shè)置下拉列表框

具體代碼：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>HTML下拉列表框 - 編程獅(w3cschool.cn)</title>
</head>
<body>
	<form>
		<label>地區(qū)</label>
		<select>
			<option value="福建">福建</option>
			<option value="浙江">浙江</option>
			<option value="上海">上海</option>
			<option value="江蘇">江蘇</option>
		</select>
	</form>
</body>
</html>

HTML 下拉列表框默認(rèn)值怎么設(shè)置？

列表框中顯示的值默認(rèn)第一個(gè)值，如果需要指定顯示值，在選項(xiàng)標(biāo)簽中加入?selected="selected"?屬性即可。如下：

<option value="上海" selected="selected">上海</option>

value 的值是用于像服務(wù)器提交的值，并非顯示在頁面上的值。

下拉列表也可以設(shè)置為多選，實(shí)現(xiàn)這個(gè)功能需要在 select 標(biāo)簽上加入?multiple="multiple"?屬性。在頁面操作進(jìn)行多選時(shí)需要按下 Ctrl 鍵同時(shí)進(jìn)行單擊（Mac 系統(tǒng)下使用 Command+ 單擊）。

以上就是文章“HTML 下拉列表框怎么設(shè)置？下拉列表框默認(rèn)值怎么設(shè)置？”的全部?jī)?nèi)容。想要了解更多 HTML 學(xué)習(xí)知識(shí)，請(qǐng)前往 w3cschool。

HTML

0 人點(diǎn)贊