[英]Text/Links background should be transparent over a gradient background but is in white
I have a small problem. 我有一个小问题。 I'm starting to devise a new site for myself, www.dvpwebdesign.com.
我正在为自己设计一个新网站,www.dvpwebdesign.com。 I'm currently just using html and css on it.
我目前只在上面使用html和CSS。 The problem i have is IE, my intro page has a repeated gradient background, with links/text over it.
我的问题是IE,我的简介页上有重复的渐变背景,上面有链接/文字。 All works fine on Safari, Firefox, but not the dreaded IE, which shows a white background behind the text.
所有这些在Safari,Firefox上都可以正常运行,但在可怕的IE上却无法正常工作,IE的文本后面显示白色背景。 The rest of the screen has the gradient background correctly.
屏幕的其余部分正确具有渐变背景。 I know you are supposed to use background-color:none, which i did do.
我知道您应该使用background-color:none,我确实这样做过。 I also tried background-color:transparent, all to no avail.
我也尝试了background-color:transparent,全部无济于事。 If anyone can help i'd be very appreciative?
如果有人可以帮助我会很感激? Below is the CSS, you can get the html from the site which is live, thanks in advance:
下面是CSS,您可以从现场网站获取html,在此先感谢:
body {
margin: 0;
padding: 0;
background-color: none;
width:1000px;
background-image: url(gradient4.jpg);
background-repeat: repeat-x;
}
#menu a{
color:#a0a0a0;
font-weight:normal;
text-decoration:none;
font-size:14px;
margin-left:10px;
margin-top:-35px;
font-family: Skia;
}
#menu a span.two{
color:#33ccff;
cursor:pointer;
font-size:14px;
font-weight:500px;
font-family: Skia;
}
#menutwo a{
color:#9966ff;
font-weight:normal;
text-decoration:none;
font-size:12px;
margin-left:10px;
margin-top:-35px;
font-family: Skia;
}
#menutwo a span.two{
color:#660099;
cursor:pointer;
font-size:12px;
font-family: Skia;
}
#menuthree a{
color:#c8c8c8;
font-weight:normal;
text-decoration:none;
font-size:80px;
font-family: Skia;
}
#menuthree a span.two{
color:#33ccff;
cursor:pointer;
font-size:80px;
font-family: Skia;
}
#menufour a{
color:#b8b8b8;
font-weight:normal;
text-decoration:none;
font-size:42px;
font-family: Skia;
}
#menufour a span.two{
color:#339999;
cursor:pointer;
font-size:42px;
font-family: Skia;
}
#menufive a{
color:#a8a8a8;
font-weight:normal;
text-decoration:none;
font-size:22px;
font-family: Skia;
}
#menufive a span.two{
color:#0066ff;
cursor:pointer;
font-size:22px;
font-family: Skia;
}
ul#menu {
width : 1000px;
list-style-type : none;
position : relative;
margin-top:20px;
margin-right:230px;
float: right;
display:inline;
font-family: Skia;
letter-spacing: 1px;
}
#menu li {float: right;
display:inline;}
ul#menutwo {
width : 1000px;
letter-spacing: 1px;
margin-top:-10px;
margin-bottom:20px;
list-style-type : none;
position : relative;
float: right;
display:inline;
font-size:24px;
font-family: Skia;
margin-right:180px;
}
#menutwo li {float: right;
display:inline;}
ul#menuthree {
width : 1000px;
letter-spacing: 1px;
list-style-type : none;
position : relative;
float: left;
display:inline;
font-family: Skia;
top: 300px;
}
#menuthree li {float: left;
display:inline;}
ul#menufour {
width : 1000px;
letter-spacing: 1px;
list-style-type : none;
position : relative;
float: left;
display:inline;
font-family: Skia;
top: 320px;
}
#menufour li {float: left;
display:inline;}
ul#menufive {
width : 1000px;
letter-spacing: 1px;
list-style-type : none;
position : relative;
float: left;
display:inline;
font-family: Skia;
top: 340px;
}
#menufive li {float: left;
display:inline;}
Some of your jQuery shenanigans must be applying the background colour as an inline style. 您的某些jQuery恶作剧必须将背景颜色用作内联样式。
This is what I get in IE 8's developer tools for the spans: 这是我在IE 8的开发人员工具中获得的跨度:
filter: alpha(opacity=100); ZOOM: 1; background: #fff;
Update: here it is. 更新:在这里。 In
fadelinks.js
在
fadelinks.js
var bgcolor = "#fff"; // unfortunately we have to set bg color because of that freakin' IE *!$%#!!?!?%$!
//please use the same background color in your links as it is in your document.
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.