目前我的页面是这样的:
但是当我向下滚动时,星星的背景图像与 Logo 部分重叠,如下所示:
这是站点标题 CSS 的样子:
.site-header {
position: relative;
z-index: 1000;
/*background-attachment: fixed; */
}
.site-header .home-link {
color: #141412;
display: block;
margin: 0 auto;
max-width: 1080px;
height: 130px;
padding: 0 20px;
text-decoration: none;
width: 100%;
}
.site-header .site-title:hover {
text-decoration: underline;
}
.site-title {
font-size: 60px;
font-weight: bold;
line-height: 1;
margin: 0;
padding: 58px 0 20px;
}
.site-description {
font: 300 italic 24px "Source Sans Pro", Helvetica, sans-serif;
margin: 0;
}
这就是目前设置星图格式的方式:
body.page-id-72 #stars {
background: #425169 url("../images/photos/stars.gif") top center;
width: 100%;
height: 8000px;
position: fixed;
top: 300px;
z-index: 100;
}
我希望网站标题背景保持白色,如第一张图片所示。在这方面的任何帮助都会很棒
最佳答案
只需将其添加到您的 CSS 中即可。您目前没有 .site-header
的任何背景,因此当您向下滚动时,它会将您的 div 背景与地球相结合。
.site-header {
background: white;
z-index: 101; //you likely need to add this too, b.c you gave a z-index of 100 to the stars
}
如果你不想在每个页面上更改.site-header,只更改带有星星背景的那个,你可以尝试
.page-id-72 .site-header {
background: white;
z-index: 101; //you likely need to add this too, b.c you gave a z-index of 100 to the stars
}
关于html - Wordpress: Logo 部分无法正常工作的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20934588/