在 IE10+ 中分别设置输入文本元素的占位符透明度和边框透明度？答案

【问题标题】：Separately style the placeholder transparency and the border transparency on input text elements in IE10+?在 IE10+ 中分别设置输入文本元素的占位符透明度和边框透明度？
【发布时间】：2014-04-04 22:39:55
【问题描述】：

我想使用不透明度值为 0.5 且边框不透明度值为 1 的占位符文本设置输入字段的样式。在 IE10+ 中，这些值似乎相互关联。

HTML：

<input type="text" placeholder = 'blah blah'/>

CSS：

body {
    background-color:#CCCCFF;
}
:-ms-input-placeholder {
    color: #FFFFFF;
    opacity:.2;
}

input[type="text"] {
     border: 1px solid #FFFFFF;
     background-color: transparent;
     padding:1em;
     opacity:1;
}

http://jsfiddle.net/D6HPN

有没有办法使用 CSS 或 JS 独立设置它们？我知道我可以使用带有实线边框的背景 div，但我不想这样做。

【问题讨论】：

标签： javascript html css internet-explorer

【解决方案1】：

使用：rgba(255,255,255,1) 而不是 #FFFFFF 并将 1 设置为您想要的不透明度。

【讨论】：