Product Landing Page - Build a Product Landing Page

HTML-CSS
1

Tell us what’s happening:

How do I use external resources like images in my projects?

Your code so far

<!-- file: index.html -->


/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Product Landing Page - Build a Product Landing Page

2

You can refer to an image by URL

<img src="http://website.com/image.jpg">
1 Like
3

Hello and welcome to the forum!

Images from our computers cannot be directly linked to projects. They need to be hosted online. There are some free hosting sites where one can upload their images to, or can use existing images from those sites, for projects. A few of these are pexels, pixabay and unsplash. This would require opening the image in a new tab to assure the jpeg, or png, is visible to copy the link and use it.

Example:

<img src="https://images.pexels.com/photos/25677021/pexels-photo-25677021/free-photo-of-village-in-green-valley.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2 alt="village">

The above is the link for the following.
<img src=

I have added the alt attribute and value as this is a img.

If using a link for a href, no alt is required.

<a target="_blank" href="https://images.pexels.com/photos/25677021/pexels-photo-25677021/free-photo-of-village-in-green-valley.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2">A village</a>

I hope this helps you!