I write this code to set the image for may background but i didn't get my background images what I do? Any Solution?
.instantqoute{ background:url('images/services/Chrysanthemum.jpg'); }
<br><br> <div class="row instantqoute" > <div class="col-sm-12"> </div> </div>
All else being equal, and assuming your URLs are correct:
There is no content inside the div. There is no explicit height set on it. It therefore has a computed height of 0
. This provides no area for the background to be painted on.
It needs a height. Give it one by putting some content in it or setting the height
or min-height
property.
please give height and width to .instantqoute
. Background image not loading because div is blank.
Check your URL and add height and width to your div.
<style>
.instantqoute {
background:url('images/services/Chrysanthemum.jpg');
}
</style>
<br><br>
<div class="row instantqoute" style="width:100px; height:100px;">
<div class="col-sm-12"></div>
</div>
Hope it will help.
U need to have size of this div, for example
.instantqoute { background:url('images/services/Chrysanthemum.jpg'); width: 100px; height: 100px; }
<div class="row instantqoute" > <div class="col-sm-12"> </div> </div>
Most common mistake is bad link for example structure
-css/style.css
-js/script.js
-img/image.jpg
-index.html
Background is loading from css so if u give link like this "img/image.jpg"
Style css try to find this image in location: "css/img/image.jpg"
for left folder u need to type "../"
for example: "../img/image.jpg"
My london sucks
Assuming given path is correct:
Your div instantqoute
does not contain any content therefore your image is not shown.
Why?
Since you haven't given a width and a height to the (div/img) / no content.
Solution:
Give height and width to the div & add content (If required).
Next:
If height and width given and you still cannot see the background.
Then:
Assuming given path is incorrect:
By "below" and "above", I mean subdirectories and parent directories. Relative file paths give us a way to travel in both directions. Take a look at my primitive example:
Here is all you need to know about relative file paths:
You can use <img>
to achive this check below Add height and width to your div also check if the url to the image is correct.
<br><br>
<div class="row instantqoute" style="height:200px;width:200px;"><img src='images/services/Chrysanthemum.jpg' style="height:100%;width:100%; ">
<div class="col-sm-12">
</div>
</div>
You could do like this:
.instantqoute{ background: url(http://via.placeholder.com/2000x400); height: 400px; width: 100%; }
<div class="row instantqoute" > <div class="col-sm-12"> </div> </div>
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.