如何修改placeholder样式

 时间:2026-04-23 13:21:24

1、新建html文件,在html文件中输入input标签然后给标签添加placeholder值。如图:

代码:<input type="text" placeholder="请输入用户名"  />

如何修改placeholder样式

2、保存好html页面后使用浏览器打开,发现input输入框提示的文字是灰色的。

如何修改placeholder样式

3、修改提示文字颜色。创建style标签,在这个标签里设置提示框文字的颜色。

如图:

代码:

<style type="text/css">

input::-webkit-input-placeholder{ /*WebKit browsers*/

color: red;

}

input::-moz-input-placeholder{ /*Mozilla Firefox*/

color: red;

}

input::-ms-input-placeholder{ /*Internet Explorer*/ 

color: red;

}

</style>

如何修改placeholder样式

4、保存html文件后使用浏览器打开,发现提示文字颜色已变为红色。如图:

如何修改placeholder样式

5、所有代码。可以直接把所有代码复制到新建的html文件上,保存后运行即可看到效果。

所有代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title></title>

<style type="text/css">

input::-webkit-input-placeholder{ /*WebKit browsers*/

color: red;

}

input::-moz-input-placeholder{ /*Mozilla Firefox*/

color: red;

}

input::-ms-input-placeholder{ /*Internet Explorer*/ 

color: red;

}

</style>

</head>

<body>

<input type="text" placeholder="请输入用户名"  />

</body>

</html>

  • html中怎么隐藏input标签
  • mysql ERROR 1045 (28000)怎么解决
  • idea怎么安装插件
  • jdk没有jre怎么办
  • HTML网页怎样获取input的值
  • 热门搜索
    lol手游怎么设置中文 用手机怎么赚钱 康宝莱奶昔减肥怎么样 榴莲怎么挑 大虾怎么做 刺猬怎么吃 房产证怎么办理 ps怎么保存 申请怎么写 怎么强开微粒贷