CSS如何设置占位符文本的对齐方式？
可以通过CSS的placeholder选择器使用text-align属性设置占位符文本的对齐方式。
语法：
这个CSS placeholder选择器在不同的浏览器中有不同的写法，例如：
对于Chrome，Mozilla和Opera浏览器：
::placeholder
对于Internet Explorer：
:-ms-input-placeholder
示例：设置占位符文本对齐方式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>占位符对齐</title>
<style>
input[type="email"]::placeholder {
/* Firefox, Chrome, Opera */
text-align: center;
}
input[type="text"]::placeholder {
/* Firefox, Chrome, Opera */
text-align: right;
}
input[type="tel"]::placeholder {
/* Firefox, Chrome, Opera */
text-align: left;
}
input[type="email"]:-ms-input-placeholder {
/* Internet Explorer 10-11 */
text-align: center;
}
input[type="email"]::-ms-input-placeholder {
/* Microsoft Edge */
text-align: center;
}
body {
text-align:center;
}
h1 {
color:green;
}
</style>
</head>
<body>
<h3>占位符文本对齐方式</h3>
<p>中心对齐<br><input type="email" placeholder="Email"></p><br>
<p>右对齐<br><input type="text" placeholder="Name"></p><br>
<p>左对齐<br><input type="tel" placeholder="Phone Number"></p>
</body>
</html>效果图：
以上就是CSS如何设置占位符文本的对齐方式？的详细内容，更多请关注易知道|edz.cc其它相关文章！
