vant自定义样式,vant按需引入没样式
本文主要介绍vant如何修改占位符样式，有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。
目录
如何修改占位符样式，设置占位符属性样式的各种写法：第一种最简单的方法，第二种方法，第三种方法。
如何修改placeholder样式
:-webkit-input-placeholder {
颜色：# ffffff
字体粗细：400；
}
/*火狐4-18 */
:-moz-placeholder {
颜色：# ffffff
字体粗细：400；
}
/*火狐19-50 */
:-moz-placeholder {
颜色：# ffffff
字体粗细：400；
}
/*-Internet Explorer 1011
- Internet Explorer移动版10-11 */
:-ms-input-placeholder {
颜色：#ffffff！重要；
font-weight: 400！重要；
}
/* Edge(也支持：-webkit-input-placeholder) */
:-ms-输入-占位符{
颜色：# ffffff
字体粗细：400；
}
/* CSS工作草案*/
*占位符{
颜色：# ffffff
字体粗细：400；
}
设置placeholder属性样式的多种写法
我们经常在placeholder标签中使用input属性，占位符属性主要用于在输入框中显示提示。
那当我们想要改变placeholder属性中文字的大小颜色等样式时，又如何设置呢？
让我们先来看看普通的占位符属性样式：
Type= text placeholder=正常样式
效果图：
上述样式是占位符属性的默认样式。如果我们想突出字体，我们要改变字体颜色吗？接下来我们试试把字体颜色改成红色，先想想怎么设置？
效果图：
代码：
第一种最简单的写法
在谷歌浏览器中使用
！声明文档类型
超文本标记语言
头
meta charset=utf-8
设置编写占位符属性样式/标题的各种方式
/头
风格
输入：占位符{
颜色：# DD 5a 5d；
}
/风格
身体
Type= text placeholder=字体颜色为红色
/body
/html
第二种写法
注:因为不同的浏览器兼容性不同，所以写代码会有差异。
输入：-webkit-input-placeholder {/*带有webkit内核的浏览器*/
颜色：# E0484B
}
输入：-moz-placeholder {/* Firefox版本4-18 */
颜色：# E0484B
}
输入：-moz-placeholder {/* Firefox版本19 */
颜色：# E0484B
}
输入：-ms-input-placeholder {/* IE浏览器*/
颜色：# E0484B
}
注：冒号前，可以写相应的input或textarea元素等。或者省略它，直接从冒号开始。
第三种写法
虽然有一种写法有点复杂，但还是要介绍一下。
input[type= text ]:-webkit-input-placeholder {/*带有WebKit内核的浏览器*/
颜色：# E97F81
}
input[type= text ]:-moz-placeholder {/* Firefox版本4-18 */
颜色：# E0484B
}
input[type= text ]:-moz-placeholder {/* Firefox版本19 */
颜色：# E0484B
}
input[type= text ]:-ms-input-placeholder {/* IE浏览器*/
颜色：# E0484B
}
注：第三种写法中的text是相对应html中的text，如果是密码框，那么相对应的就是password。
例如：
html：
type= password placeholder= font color is red
css：
input[type= password ]:-webkit-input-placeholder {/*带有WebKit内核的浏览器*/
颜色：# E97F81
}
其实还有很多方法，需要我们去发现。好了，今天就在这里分享一下吧。如果你有任何问题，请留言。
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。