I have a background image with background-attachment: fixed
, which works fine in all browsers in localhost but does not show in chrome on the server.
.bg-contact{
background-image: url(../images/bg-contact.jpg);
background-repeat: no-repeat;
background-position: center;
background-attachment: scroll;
background-size: cover;
}
Please help
Check the file extensions for the background, remember that capital letters make difference for example on your PC JPG and jpg is the same thing but on the server those are completely 2 different pictures.
Also include link to the website or add the code of it if you have problems with it.
-----New Idea For Answer------
You have: background-image:url(../images/bg-contact.jpg);
Use Chrome Developer Tools from your Chrome Browser to get to inspect the element where picture should be displayed, then check if the value of background-image is:
-Not crossed: then is should be working and it is not a problem with a code but with the browser.
-It is crossed: Then your background property is not working, you can add !important to it to get a quick fix but you should find the reason behind it and fix it asap.
Try clearing the cache on that Chrome.
There's also an extraneous {
which maybe Chrome is sensitive to.
Couple more things: try adding ' ' as in ('../images/bg-contact.jpg')
, and check AdBlock in Chrome.
Turned to be path issue, especially for Wordpress. When one is setting
background-image: url('bg_1.jpg');
in his themes/myTheme
Folder, the browser is loading from http://127.0.0.1:80/wordpress/bg_1.jpg
, while the file is actualy in C:\\xampp\\htdocs\\wordpress\\wp-content\\themes\\myTheme
That is why one should say:
background-image: url('res/bg_1.jpg');
and make new folder wordpress/res
in which bg_1.jpg will reside.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.