HTML5的placeholder属性用于在输入框为空时显示灰色提示文字，获焦后自动消失；支持text、search、email等类型，可通过HTML直接设置、JS动态修改、CSS伪元素自定义样式，并需JS兼容IE9以下浏览器。
如果您希望在HTML5页面中为搜索框或其他输入框设置默认提示文字，可以通过placeholder属性实现。该属性会在输入框为空时显示灰色提示文本，用户开始输入后自动消失。以下是具体设置方法：
一、使用placeholder属性直接设置
placeholder是HTML5原生支持的input元素属性，适用于text、search、email、url、tel、number等类型输入框。它仅作提示用途，不会提交到服务器，也不影响表单验证逻辑。
1、在input标签中添加placeholder属性，并赋予字符串值。
2、确保input的type属性为search或text等支持placeholder的类型。
立即学习“前端免费学习笔记（深入）”；
3、示例代码：。
二、通过JavaScript动态设置placeholder
当需要根据条件或用户行为动态更改提示文字时，可使用JavaScript操作DOM元素的placeholder属性。
1、为input元素设置id，例如：。
2、在script标签中获取该元素：const input = document.getElementById('searchBox');。
3、赋值placeholder：input.placeholder = '搜索新闻或文章';。
三、使用CSS自定义placeholder样式
浏览器默认的placeholder文字颜色较浅且不可选，可通过伪元素调整其外观，提升视觉一致性。
1、针对WebKit内核（Chrome、Safari）使用::webkit-input-placeholder。
2、针对Firefox使用::moz-placeholder（旧版）或::placeholder（新版）。
3、示例CSS：input::placeholder { color: #666; font-size: 14px; }。
四、兼容IE9及以下版本的fallback方案
IE9及更早版本不支持placeholder属性，需借助JavaScript模拟该行为，防止提示功能完全失效。
1、在input中同时设置value和data-placeholder属性：邮箱" data-placeholder="请输入邮箱">。
2、页面加载后，若value等于data-placeholder，则清空value并添加class标记状态。
3、绑定focus和blur事件：focus时清空内容；blur时若为空则恢复提示文字。
