大家好,我正在使用 CSS,我仍在学习 div 来替换表格和行。我想知道每当我附加一个没有背景的背景图像只是普通图像(透明背景)时,即使它在 Photoshop 中的背景是透明的,它怎么会在网站外观上显示白色背景?如何去除白色背景?请把我引向正确的轨道。谢谢
我试过背景颜色:透明;它不工作:(
这是我在 css div baclground-image http://postimg.org/image/75t1jgqk3/上使用的输出图像
这是在 Photoshop http://postimg.org/image/o1jddulcx/中具有透明背景的图像视图
这是我的 css 和 html 代码http://jsfiddle.net/XpCmb/
@charset "utf-8";
/* CSS Document */
body
{
margin:0px;
padding:0px;
}
#container
{
padding:30px;
min-width:1024px;
min-height:768px;
background:#d8e0eb;
border:0px;
margin:0px;
}
#container2
{
width:1000px;
height:730px;
background-color:#FFF;
padding-top:25px;
padding-bottom:15px;
}
#wrapper
{
min-width:800;
min-height:600px;
}
#header
{
width:900px;
height:120px;
background-color:violet;
}
#menubar
{
background-color:#FFF;
width:452px;
height:30px;
padding-top:5px;
padding-bottom:5px;
text-decoration: none;
float:;
}
#content
{
width:1000px;
height:40px;
background-color:#f9f2e0;
}
#contentbody
{
width:1000px;
height:auto;
padding-top:50px;
margin-left:0;
margin-right:0;
background-color:#f9f2e0; /*baclground of content holder body */
padding-bottom:100px; /*adjust the space bottom of content holder text */
}
#contentbodytext
{
margin-left:50px;
text-align:left;
}
ul
{
list-style-type:none;
padding:0;
margin:0;
display:inline;
}
li
{
list-style-type:none;
background-color:#;
border-right:1px solid #CCC;
float:left;
padding-left:30px; /*adjust space of menu text to each other*/
padding-right:30px;
padding-top:8px;
padding-bottom:8px;
}
a:link
{
text-decoration:none;
} /* unvisited link */
a:visited {text-decoration:none;
} /* visited link */
li:hover
{
background-color:#ffd640;
}
ul#mcolor li:hover > a
{
background-color:#ffd640; <!-- sets all link color when hovering to yellow -->
}
ul#mcolor li.active a
{
color: rgb(25, 25, 25);
background-color: #ffd640;
}
#mcolor li.active {
background: none repeat scroll 0 0 #ffd640 !important;
}
/*FOLLOWS ARE MISCELLENEOUS LIKE DIVS image holder etc. */
/*ul:hover li
{
opacity: 0.5;
}
ul li:hover
{
opacity: 1;
}
nk */
#image1
{
padding-left:50px;
float:left;
}
#p1a
{
padding-left:350px;
}
#introductiona
{
padding-right:50px;
text-align:justify;
text-align:justify;
}
#p1
{
margin-left:50px;
text-align:left;
margin-top:70px;
}
#bulletin
{
float:left;
margin-left:10px;
background-image:url(bulletinboard.jpg);
background-size:550px 260px;
background-repeat:no-repeat;
width:550px;
height:260px;
background-color:#f9f2e0;
}