介绍::占位符 :-ms-input-placeholder ::-ms-input-placeholder & lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=癠TF-8"祝辞
& lt; title> CSS更改占位符颜色& lt;/title>
& lt; style>
::占位符{/* Firefox、Chrome, Opera */颜色:蓝色;
字体大小:15 px;
}
:-ms-input-placeholder {/* ie - 11 */颜色:红色;
字体大小:15 px;
}
::微软-ms-input-placeholder {/* */颜色:橙色;
字体大小:15 px;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div类=癲emo"祝辞
& lt; p>更改占位符颜色& lt;/p>
& lt;输入类型=皌ext"占位符=扒胧淙?....“比;
& lt;/div>
& lt;/body>
& lt;/html> & lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt;元charset=癠TF-8"祝辞
& lt; title> CSS更改占位符颜色& lt;/title>
& lt; style>
输入(type=癳mail")::占位符{/* Firefox、Chrome, Opera */颜色:蓝色;
字体大小:15 px;
}
文本区域:占位符{/* Firefox、Chrome, Opera */颜色:红色;
字体大小:15 px;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div类=癲emo"祝辞
& lt; p>更改占位符颜色& lt;/p>
& lt;输入类型=癳mail"占位符=扒胧淙胗始?...“比;& lt; br/祝辞& lt; br/比;
& lt; textarea行=?0“;50关口=?“占位符=扒胧淙胗始?...“祝辞& lt;/textarea>
& lt;/div>
& lt;/body>
& lt;/html>
使用CSS更改占位符颜色的方法?这个问题可能是我们日常学习或工作经常见到的。希望通过这个问题能让你收获颇深。下面是小编给大家带来的参考内容,让我们一起来看看吧!
<强>
在CSS中想要更改占位符的颜色,可以非标准选择器::占位符来实现,它是用于设置表单输入框占位符的外观,通过该选择器可以改变占位符的样式,例如:颜色。
<强>对于不同的浏览器,::占位符选择器的写法是不同的强,下面我们来了解一下。
对于Chrome, Mozilla和Opera浏览器,选择器可以写为:
对于Internet Explorer,选择器需要写为:
对于互联网优势,选择器需要写为:
<强>
下面我们通过简单的代码示例来具体了解一下如何使用::占位符选择器来更改占位符颜色。
<强>示例1:在不同浏览器中使用::占位符选择器
输出:
●,没有使用::占位符选择器
●,在谷歌浏览器中
●,在Internet Explorer浏览器中
<强>示例2:在输入标签的电子邮件属性,textarea标签中使用占位符选择器
输出:
说明:
占位符选择器可以应用于输入标签的任何属性(文本,电话,密码等),以突出显示任何不同属性的颜色变化。
感谢各位的阅读!看完上述内容,你们对使用CSS更改占位符颜色的方法大概了解了吗?希望文章内容对大家有所帮助。如果想了解更多相关文章内容,欢迎关注行业资讯频道。
