Finding and Adding Images
Goal
Let's add some images to the website to make it more attractive for users. How can we do this? We can find pictures on sources such as Unsplash. There, we can search for the desired topic, select the image, copy its address, and use it on the website.
Steps
1. Look for the desired topic
Let's visit the https://unsplash.com/. Feel free to type any topic that interests you here.
2. Select the image
Find the image that you like the most and click on it.
3. Copy image address
To copy the image address, right-click on the image and select "Copy Image Address" from the contextual menu.
4. Image usage
We can paste the copied address into the image src attribute to add the selected image to our website. We should also specify the image width to ensure it fits the website well. Additionally, we can provide descriptive content for the alt attribute or use the article title for the image alt.
Example:
index.html
Result
index.html
index.css
Website State
Video Tutorial
Thanks for your feedback!
Ask AI
Ask AI
Ask anything or try one of the suggested questions to begin our chat
How do I add an image to my website using the copied address?
Can you explain how to set the width and alt attributes for the image?
What should I do if the image doesn't display correctly on my website?
Awesome!
Completion rate improved to 5
Finding and Adding Images
Swipe to show menu
Goal
Let's add some images to the website to make it more attractive for users. How can we do this? We can find pictures on sources such as Unsplash. There, we can search for the desired topic, select the image, copy its address, and use it on the website.
Steps
1. Look for the desired topic
Let's visit the https://unsplash.com/. Feel free to type any topic that interests you here.
2. Select the image
Find the image that you like the most and click on it.
3. Copy image address
To copy the image address, right-click on the image and select "Copy Image Address" from the contextual menu.
4. Image usage
We can paste the copied address into the image src attribute to add the selected image to our website. We should also specify the image width to ensure it fits the website well. Additionally, we can provide descriptive content for the alt attribute or use the article title for the image alt.
Example:
index.html
Result
index.html
index.css
Website State
Video Tutorial
Thanks for your feedback!