Home > Web Front-end > HTML Tutorial > How to hide input tag in html

How to hide input tag in html

青灯夜游
Release: 2023-01-11 09:19:51
Original
12611 people have browsed it

html How to hide input tags: 1. Set the hidden attribute to the input tag, with the syntax ""; 2. Set the value of the type attribute of the input tag to "hidden", with the syntax " ".

How to hide input tag in html

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

htmlHide the input tag

Method 1: Set the hidden attribute to the input tag

hidden The attribute specifies that the element is hidden. Hidden elements will not be displayed.

If this attribute is used, the element will be hidden.

The hidden attribute can be set so that users can only see an element when certain conditions are met (such as checking a check box, etc.). You can then use JavaScript to remove the hidden attribute, making the element visible.

Example:

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

Rendering:

How to hide input tag in html

##Method 2: Set the value of the type attribute of the input tag Specifies the type of element to be displayed for the "hidden"

type attribute; setting the value to hidden defines a hidden input field.

Example:


<!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>
Copy after login
Rendering:

How to hide input tag in html##Recommended tutorial: "

html video tutorial

"

The above is the detailed content of How to hide input tag in html. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template