简体   繁体   中英

Background image not showing in chrome

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);

  1. Make it with a full path to the file
  2. 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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM