所以我在我博客的顶部横幅上设置了我的搜索表单,但是当我将主页留到另一个页面时,背景图片搜索图标就消失了!有关为什么会发生这种情况的任何建议吗?谢谢;-) http://demo.boxofficeboxing.co.uk
#s {
padding:8px 6px;
background:rgba(0, 0, 0, 0);
border-style: solid;
border-color: #fff;
border-width: 1px 0px 1px 1px;
font-family:open sans;
font-size:14px;
color: #fff;
}
#searchsubmit {
cursor:pointer;
position:relative;
padding:8px 16px;
left:-9px;
border-style: solid;
border-color: #fff;
border-width: 1px 1px 1px 0px;
background-color: #a88f4b;
font-family:open sans;
font-size:14px;
background-image: url('wp-content/uploads/2017/12/search.png');
background-position: center center;
background-repeat:no-repeat;
text-indent: -9999px;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: white;
}
::-moz-placeholder { /* Firefox 19+ */
color: white;
}
:-ms-input-placeholder { /* IE 10+ */
color: white;
}
:-moz-placeholder { /* Firefox 18- */
color: white;
}
input:focus {
outline: none;
}
答案 0 :(得分:1)
很容易破解..
图片图标的路径设置为
wp-content/uploads/2017/12/search.png
所以当在主页上时 - 网址变为
http://demo.boxofficeboxing.co.uk/wp-content/uploads/2017/12/search.png
当在内页 - 说视频集锦 - 时,网址变为
http://demo.boxofficeboxing.co.uk/videos-highlights/wp-content/uploads/2017/12/search.png
解决相同问题的一种方法是将css中的URL设置为
/wp-content/uploads/2017/12/search.png
这应该可以解决你的问题/问题。
答案 1 :(得分:0)
您对图像的引用是相对的,因此当您转到另一页时,它的引用是错误的。将您的background-image
网址值设为绝对值。
答案 2 :(得分:0)
提供给wp-content/uploads/2017/12/search.png
的网址background-image
是相对的,因此当它在您的主页上有效时,如果您导航到/news/
部分,则变为http://demo.boxofficeboxing.co.uk/news/wp-content/uploads/2017/12/search.png
而不是http://demo.boxofficeboxing.co.uk/wp-content/uploads/2017/12/search.png
http://...
。只需给它一个完整的{{1}}完整的网址,就可以了。