How To Put Background Image Path From Remote Web Site?

I need grab images from Imgur to My web page background image

My image path is https://imgur.co

Solution 1:

You need to copy the right image path: https://i.imgur.com/QdMWFHZ.jpg

Go to https://imgur.com/a/NbUpX -> right click on image -> Copy image address

After this you need to put it into background-image:url('https://i.imgur.com/QdMWFHZ.jpg');

Here you can find some documentation for background-image using.

Remember to set an height for your div, because in your solution will be 100% of nothing so this can be a solution:

<divstyle="background-image:url('https://i.imgur.com/QdMWFHZ.jpg'); width:100%; height:200px; background-size: contain; background-repeat: no-repeat;"class="zoom" >

Solution 2:

Update image url like this

<div style="background-image:url('https://i.imgur.com/QdMWFHZ.jpg'); background-repeat:no-repeat; width:100%; height:100%;"class="zoom" >

Solution 3:

Open your image path, after that right click on the image and click "Copy image address". And then paste address on your code.

<div style="background-image:url(https://i.imgur.com/QdMWFHZ.jpg); width:100%; height:100%;"class="zoom" >

Solution 4:

or in your CSS directly as background-image: url("https://i.imgur.com/QdMWFHZ.jpg")

---

since you need background of webpage it would be part of the body attribute like (CSS):

body  {
    background-image: url("https://i.imgur.com/QdMWFHZ.jpg")
}

You can test it here

Share