爱站程序员基地HTML的placeholder属性指定一个简短提示，用于描述input字段或文本区域（textarea）的预期值，即占位符文本。短提示在用户输入值之前显示在字段中。在大多数浏览器中，占位符文本通常左对齐。那么如何设置占位符文本的对齐方法？下面本篇文章就来介绍一下，希望对大家有所帮助。
CSS设置占位符文本的对齐方式
可以通过CSS的placeholder选择器使用text-align属性设置占位符文本的对齐方式。
语法：
这个CSS placeholder选择器在不同的浏览器中有不同的写法，例如：
对于Chrome，Mozilla和Opera浏览器：
[code]::placeholder
对于Internet Explorer：
[code]:-ms-input-placeholder
示例：设置占位符文本对齐方式
[code]<!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>
效果图：
更多网站前端开发知识，请查阅 HTML中文网 ！！
