天天看点
返回

改变输入框光标颜色

<!doctype html>
<html >
<head>
	<meta charset="UTF-8">
	<title>改变输入框光标颜色</title>
	<style>
		input {
		    color: #333;
		    caret-color: red;
		}
	</style>
</head>
<body>
	<!-- Safari以及IE浏览器有兼容问题 -->
	<input value="改变输入框光标颜色">
</body>
</html>
<!doctype html>
<html >
<head>
	<meta charset="UTF-8">
	<title>改变输入框光标颜色</title>
	<style>
		.input {
		    color: red;
		}
		.input::first-line {
		    color: #333;
		}
	</style>
</head>
<body>
	<!-- Safari以及IE浏览器有兼容问题 -->
	<input value="改变输入框光标颜色" class="input" />
</body>
</html>
<!doctype html>
<html >
<head>
	<meta charset="UTF-8">
	<title>最终版--改变输入框光标颜色</title>
	<style>
		.center {
		    color: #333;
		    caret-color: red;
		}
		@supports (-webkit-mask: none) and (not (caret-color: red)) {
		    .center { color: red; }
		    .center::first-line { color: #333; }
		}
	</style>
</head>
<body>
	<input value="混合兼容处理" class="center" />
</body>
</html>
改变输入框光标颜色
css 光标 输入框 颜色 input 改变输入框光标颜色
上一篇: 1114 按序打印
下一篇: vue 实现点击插入输入框_vue 实现在文本框光标处插入内容

继续阅读