Jak ustawić przezroczyste pole wprowadzania html na przezroczystym div?

Mam zestaw div przejrzysty z rgba i chcę na tej div pole wejściowe, które również ma przezroczyste tło. Problem polega na tym, że tło pola wejściowego nie jest renderowane jako przezroczyste. Działa, jeśli używam opacity:0.8; na div, ale tekst jest przezroczysty, więc potrzebuję rgba. Dla drugiego pola wejściowego, które znajduje się poza przezroczystym div rgba działa.Jak ustawić przezroczyste pole wprowadzania html na przezroczystym div?

Oto mój przykładowy kod:

<!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>

Jakieś pomysły?

Dzięki!

Natanael

Źródło

2012-06-27 Nathanael

Hej Nathaneal jego pracy w porządku, gdybym Chang wartość rgba więc tekst nie będzie przejrzysty

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

mam nadzieję, że to pomoże ... można zobaczyć demo: - http://jsbin.com/avupaw/16/edit#html,live

Źródło

2012-06-27 08:53:00

Wielkie dzięki. Ustawienie koloru tła pola wejściowego całkowicie przezroczystego nie przyszło mi do głowy ;-) – Nathanael

Albo po prostu

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

Źródło

2013-07-31 14:09:27 tandrewnichols

Jak ustawić przezroczyste pole wprowadzania html na przezroczystym div?

Odpowiedz

Powiązane problemy