CSS - 伪类 :disabled



CSS 伪类选择器 :disabled 表示被禁用的元素。如果元素无法激活(选择、单击、键入等)或不接受焦点,则该元素处于禁用状态。

语法


:disabled {
	 	/* ... */
}

CSS :disabled 示例

下面是 :disabled 伪类的示例。在这里,您可以看到一个禁用的输入和按钮。


<html>
<head>
<style>
		 	input[type=text]:enabled {
		 			 	background: white;
		 	}

		 	input[type=text]:disabled {
		 			 	background: lightgrey;
		 	}

		 	input {
		 			 	width: 150px;
		 			 	padding-left: 10px;
		 			 	margin-top: 10px;
		 			 	border: 1px solid black;
		 	}
</style>
</head>
<body>
		 	<h2>:disabled example</h2>
		 	<form action="">
	 	 	 <label>Doctor Name</label>
	 	 	 <input type="text"><br>
	 	 	 <label>Hospital Name</label>
	 	 	 <input type="text"><br>
	 	 	 <label>Diagnosis</label>
	 	 	 <input type="text" disabled="disabled" value="Diagnosis"><br><br>
	 	 	 <button type="submit" disabled="disabled">Submit</button>
	 	 	 <button type="reset">Reset</button>
		 	</form>
</body>
</html>