如何使用css将图像添加到透明框中

所以是的，我的英语不是很好，但我认为你能理解我。我创建了一个透明盒子，我想向它添加一个图像，但是当我添加图像时，它也变得透明，我该怎么办？如何使用css将图像添加到透明框中

这是我的代码：

html { 
 
    background: url(Untitled-4.jpg) no-repeat center center fixed; 
 
    -webkit-background-size: cover; 
 
    -moz-background-size: cover; 
 
    -o-background-size: cover; 
 
    background-size: cover; 
 
} 
 
body { 
 
text-align: center; 
 
} 
 
#main { 
 
width: 700; 
 
height: 400; 
 
background:#FFFFFF; 
 
margin: 25px auto; 
 
border: solid 5px #191919 
 
display:  inline-block; 
 
padding:  8px 20px; 
 
background: #073763 url repeat-x; 
 
border-radius: 5px; 
 
color:   #fff; 
 
font:   normal 700 24px/1 "Calibri", sans-serif; 
 
text-align: center; 
 
text-shadow: 1px 1px 0 #000; 
 
opacity: 0.5;

<html> 
 
<head> 
 
<title>Dragon Kova Z: Fryzo prisikėlimas </title> 
 
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /> 
 
<link href="style.css" type="text/css" rel="stylesheet"> 
 
</head> 
 
</html> 
 
<body> 
 
<img src="filmo info.gif" alt="Mountain View" 
 
<div id="main"> 
 
<embed src="FLOW - HERO -Kibou no uta-.mp3" 
 
width="0" height="0" 
 
autostart="false" 
 
name="mysound" 
 
enablejavascript="true"/>

来源

2015-08-08 BananaFlow

要保留继承opacity属性时元素去半透明的内容，也适用透明度你的元素没有一招使图像或任何内容透明。只设置背景颜色为透明，像这样 -

#main { 
    background-color: rgba(255,255,255,0.5); 
}

现在不使用不透明度。

来源

2015-08-08 11:10:22

OMG，感谢ü非常老兄你帮了我;） – BananaFlow

是啊，已经做到了:) – BananaFlow

在这里，您填充背景坚实，但实际你需要在div框透明单位的背景，所以你会APLY背景RGBA（）函数那么你可以easilly申请

<html> 
<head> 
<title>Dragon Kova Z: Fryzo prisikėlimas </title> 
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /> 
<link href="style.css" type="text/css" rel="stylesheet"> 
</head> 
<body> 
    <img src="filmo info.gif" alt="Mountain View"/> 
<div id="main"> 
    <embed src="FLOW - HERO -Kibou no uta-.mp3" 
width="0" height="0" 
autostart="false" 
name="mysound" 
enablejavascript="true"/> 

    Hello 
    Hows you ?<br> 
    Fine.... :) 
</body> 

html { 
    background: url(Untitled-4.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 
body { 
text-align: center; 
} 
#main { 
width: 700; 
height: 400; 
background:rgba(10,12,200,0.2); 
margin: 25px auto; 
border: solid 5px #191919 
display:  inline-block; 
padding:  8px 20px; 
background: #073763 url repeat-x; 
border-radius: 5px; 
color:   #fff; 
font:   normal 700 24px/1 "Calibri", sans-serif; 
text-align: center; 
text-shadow: 1px 1px 0 #000; 
}

来源

2015-08-08 11:31:42

如何使用css将图像添加到透明框中

回答

相关问题