John
John

Reputation: 145

how to put background image path from remote web site?

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

 <div style="background-image:url(); width:100%; height:100%;" class="zoom" >

My image path is https://i.sstatic.net/1SPP3.jpg

then how can I put this image to my background image url?

Upvotes: 0

Views: 1550

Answers (4)

oetoni
oetoni

Reputation: 3897

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

Upvotes: 0

bruce182
bruce182

Reputation: 311

You need to copy the right image path: https://i.sstatic.net/32Kq8.jpg

Go to https://i.sstatic.net/1SPP3.jpg -> right click on image -> Copy image address

After this you need to put it into background-image:url('https://i.sstatic.net/32Kq8.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:

 <div style="background-image:url('https://i.sstatic.net/32Kq8.jpg'); width:100%; height:200px; background-size: contain; background-repeat: no-repeat;" class="zoom" >

Upvotes: 1

Hartanto
Hartanto

Reputation: 47

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" >

Upvotes: 0

Ajeesh KH
Ajeesh KH

Reputation: 340

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" >

Upvotes: 0

Related Questions