如何在透明div上设置html输入字段透明？

Question

如何在透明div上设置html输入字段透明？

Nat*_*ael 6 css html-input opacity css3 rgba

我有一个div设置透明与rgba并希望在该div上输入字段也具有透明背景.问题是输入字段背景不呈现透明.如果我opacity:0.8;在div上使用它,但是文本是透明的,那么它是有效的,所以我需要rgba.对于透明div rgba工作之外的第二个输入字段.

这是我的示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Insert title here</title>

<style type="text/css">

.term {
background-color: rgba(0,0,0,0.8);
color: #5fba3d;
width: 200px;
height: 100px;
}

input {
background-color: rgba(0,0,0,0.8);
color: #FFF;
border: none;
}

</style>

</head>

<body>

<div style="background-color:yellow; width:300px;">

   <div class="term">
      Input 1 <input type="text" value="Test" />
   </div>

   <br />

   <input type="text" value="Input 2" />

</div>

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

有任何想法吗？

谢谢!

拿但业

Answer 1

Sha*_*ora 8

嘿Nathaneal,如果我改变rgba值,它的工作正常,所以文字不会透明

input {
background-color: rgba(0,0,0,0.1);
color: red;
border: none;
}

Run Code Online (Sandbox Code Playgroud)

我希望这会对你有所帮助......你可以看到这个演示: - http://jsbin.com/avupaw/16/edit#html,live

Answer 2

tan*_*ols 5

要不就

input {
    background: none;
    color: red;
    border: none;
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	13 年，4 月前
查看次数：	37105 次
最近记录：	12 年，3 月前