투명 div에 html 입력 필드를 투명하게 설정하는 방법은 무엇입니까?

나는 div가 rgba와 투명하게 설정되어 있고 해당 div에는 투명 배경도있는 입력 필드가 필요합니다. 문제는 입력 필드 배경이 투명하게 렌더링되지 않는다는 것입니다. div에 opacity:0.8;을 사용할 경우 작동하지만 텍스트도 투명하므로 rgba이 필요합니다. 투명 div 외부에있는 두 번째 입력 필드의 경우 rgba이 작동합니다.투명 div에 html 입력 필드를 투명하게 설정하는 방법은 무엇입니까?

여기 내 예제 코드 :

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

어떤 아이디어가?

감사합니다.

나다나엘

출처

2012-06-27 Nathanael

헤이 Nathaneal의 전 장 RGBA 값이 너무 텍스트 난 당신이 데모를 볼 수 있습니다 ... 이 당신을 도움이되기를 바랍니다 투명

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

하지 않을 경우 잘 작동 : - http://jsbin.com/avupaw/16/edit#html,live

출처

2012-06-27 08:53:00

고마워. 입력란의 배경색을 완전히 투명하게 설정하는 것은 내 마음에 들지 않았습니다 ;-) – Nathanael

하거나

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

출처

2013-07-31 14:09:27 tandrewnichols

투명 div에 html 입력 필드를 투명하게 설정하는 방법은 무엇입니까?

답변

관련 문제