I’m trying to add a background image using an image URL. When I use, for example, (https://www.pexels.com/photo/black-suv-on-snow-covered-ground-11001379/) the image doesn’t show , but when I use (https://newevolutiondesigns.com/images/freebies/hd-wallpaper-1.jpg) the image does.
I have no idea why this happens.
.container {
background: linear-gradient(transparent 10%, #20283c 90%), url("https://www.pexels.com/photo/black-suv-on-snow-covered-ground-11001379/") no-repeat;
background-repeat: no-repeat;
background-position: center center;
background-attachment: "fixed";
background-size: cover;
background-attachment: fixed;
}
>Solution :
https://www.pexels.com/photo/black-suv-on-snow-covered-ground-11001379/
Is not an image URL, it’s a website.
The image URL of the actual image is …
https://images.pexels.com/photos/11001379/pexels-photo-11001379.jpeg
The url property needs a url pointing to an actual image file.