2014-03-12 48 views
0

我設置了與本網站類似的不透明度,但是當我在我的div上使用不透明度0.1時,文本也變得不透明度爲1,我設置了兩個div但仍然不是與本網站相同http://www.infosys.com/about/Pages/index.aspx。我的http://jsfiddle.net/5v3p7/不透明度爲段落

Here is my html: 
<!DOCTYPE.html> 

</html> 

<div id="center"> 

<div id="content"> 


<div id="text"> 
Building Tomorrow’s Enterprise 

Infosys is a global leader in consulting, technology and outsourcing solutions. As a proven partner focused on building tomorrow's enterprise, Infosys enables clients in more than 30 countries to outperform the competition and stay ahead of the innovation curve. With US$8.095bn in LTM Q3 FY14 revenues and 158,000+ employees, Infosys provides enterprises with strategic insights on what lies ahead. We help enterprises transform and thrive in a changing world through strategic consulting, operational leadership and the co-creation of breakthrough solutions, including those in mobility, sustainability, big data and cloud computing. 

Learn more about how Infosys is Building Tomorrow’s Enterprise 
Learn more about industry solutions from Infosys. 
Learn more about services from Infosys 
Learn more about products from Infosys 

</div> 


</div> 

</div> 

<div id="img"> 

<img src="http://hoklife.com/wp-content/uploads/2009/02/office-1.jpg"> 
</div> 


Here is my css: 
html 
{ 
background:blue; 
} 
#content 
{ 
position:relative; 
z-index:1; 
background:black; 
color:silver; 
min-height:1000px; 
opacity:0.5; 
font-size:40px; 
width:960px; 
margin-right:auto; 
margin-left:auto; 
padding:20px; 
} 
#text 
{ 
position:relative; 
z-index:3; 
color:white; 
min-height:500px; 
opacity:10; 
width:500px; 
font-size:40px; 
} 
#img 
{ 
position:fixed; 
top:-50%; 
left:-50%; 
height:200%; 
width:200%; 
} 
#img img 
{ 
position:absolute; 
top:0; 
left:0; 
right:0; 
bottom:0; 
margin:auto; 
min-height:50%; 
min-width:50%; 
} 

回答

2

使用背景RGBA,像這樣: -

#content { 
position: relative; 
z-index: 1; 
background: rgba(0, 0, 0, 0.4); 
color: silver; 
min-height: 1000px; 
font-size: 40px; 
width: 960px; 
margin-right: auto; 
margin-left: auto; 
padding: 20px; 
} 
+0

可以編輯我的小提琴感謝! – chris

+0

我明白了,謝謝! – chris

+0

樂意幫忙... –