元素不透明但不是边框

Question

好吧,我有这个问题,我看到有人已经问了类似的东西,但我还不明白.

我想要做的是设置一个元素的不透明度为0.7,但只是内容而不是边框​​,我希望边框保持全彩色.这里有一些示例代码:

input#element{
    width: 382px;
    height: 26px;
    border: 2px solid #FFF;
    border-radius: 3px;
    opacity: 0.8;
}

结果是我的input元素具有不透明度但是甚至是边框,有人可以告诉我如何在内容中设置不透明度而不是边框​​吗？

谢谢.

Answer 1

rgba对颜色和背景使用语法,而不对整个元素使用不透明度

演示dabblet

input {
    width: 382px;
    height: 26px;
    border: 2px solid #FFF;
    border-radius: 3px;
    background: rgba(255, 255, 255, .8);
    color: rgba(0, 0, 0, .8);
}