首頁 > web前端 > html教學 > html怎麼隱藏input標籤

html怎麼隱藏input標籤

青灯夜游
發布: 2023-01-11 09:19:51
原創
12612 人瀏覽過

html input隱藏標籤的方法:1、為input標籤設定hidden屬性,語法“”;2、設定input標籤的type屬性的值為“hidden”,語法“ 」。

html怎麼隱藏input標籤

本教學操作環境:windows7系統、HTML5版、Dell G3電腦。

html隱藏input標籤

#方法1:為input標籤設定hidden屬性

hidden屬性規定對元素進行隱藏。隱藏的元素不會被顯示。

如果使用該屬性,則會隱藏元素。

可以對 hidden 屬性進行設置,使用戶在滿足某些條件時才能看到某個元素(例如選取複選框,等等)。然後,可使用 JavaScript 來刪除 hidden 屬性,使該元素變得可見。

範例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<input placeholder="文本,字母,数字等都可输入" hidden /><br /><br />
		<input placeholder="文本,字母,数字等都可输入"/>
	</body>
</html>
登入後複製

效果圖:

html怎麼隱藏input標籤

#方法2:設定input標籤的type屬性的值為「hidden」

type 屬性規定要顯示的 元素的類型;設定值為hidden可定義隱藏輸入欄位。

範例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<input placeholder="文本,字母,数字等都可输入"/><br /><br />
		<input type="hidden" placeholder="文本,字母,数字等都可输入"/><br /><br />
		<input placeholder="文本,字母,数字等都可输入"/><br /><br />
	</body>
</html>
登入後複製

效果圖:

html怎麼隱藏input標籤

推薦教學:《html影片教學

以上是html怎麼隱藏input標籤的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板