如何格式化Opera浏览器的输入占位符文本? [英] how to format input placeholder text for the Opera browser?

问题描述

我已经使用下面的psuedo元素和伪类使用CSS设置了占位符文本的样式.这可以在Opera以外的所有主要浏览器上完成工作.我的理解是Opera不支持样式占位符文本.有人知道样式化Opera输入占位符文本的方式吗?

I have styled placeholder text with CSS using the psuedo elements and pseudo classes below. This gets the job done on all major browsers but Opera. My understanding is Opera does not support styling placeholder text. Does anyone know of a way to style Opera input placeholder text?

CSS

::-webkit-input-placeholder {
    color: red;
    font-size: 10px;
}
::-moz-placeholder {
    color: red;
    font-size: 10px;
}
:-moz-placeholder {
  color: red;
  font-size: 10px;
}
:-ms-input-placeholder {
  color: red;
  font-size: 10px;
}
input:-moz-placeholder {
    color: red;
    font-size: 10px;
}

推荐答案

Firefox和WebKit中可用的样式化占位符的现有方法都是供应商前缀且非标准的，因此不应在生产中使用.为了将来的安全，请使用JavaScript删除placeholder属性，并使用value(与类似placeholder的类结合以将占位符样式绑定到)表单字段，或使用其他文本元素来模拟占位符功能.这将在包括Opera在内的所有浏览器(当前和将来的浏览器)中保持一致.

Both existing ways to style placeholder available in Firefox and WebKit are vendor-prefixed and nonstandard and should not be used in production. For future-proofness, use JavaScript to remove placeholder attribute and use either value (in conjunction with a class like placeholder to bind placeholder styles to) of form field or an additional text element to emulate placeholder functionality. This will work consistently across browsers (current and future ones) including Opera.

这篇关于如何格式化Opera浏览器的输入占位符文本?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！