Challenge: Work with Images
Свайпніть щоб показати меню
Мета
Практика використання абсолютного шляху для зображень у HTML.
Завдання
Переконайтеся, що атрибут src першого зображення використовує абсолютний шлях. Зображення можна знайти за адресою:
https://content-media-cdn.codefinity.com/courses/c468052d-6d47-4677-b1d1-fb11ace719b1/meadia-%26-tables/adik.png
Використання абсолютного шляху для атрибута src другої картинки. Доступ до зображення тут:
https://content-media-cdn.codefinity.com/courses/c468052d-6d47-4677-b1d1-fb11ace719b1/meadia-%26-tables/joking.png
Вказання відповідного значення атрибута alt для обох зображень. Пам’ятайте, значення alt є важливим для надання контексту у випадку, якщо зображення не завантажується, або для користувачів, які використовують екранні читачі.
index.html
Підказка
- Використання тега
<img>для відображення зображення; - Використання атрибута
srcдля вказання розташування зображення; - Використання атрибута
altдля надання описового тексту для зображення; - Використання атрибута
widthдля визначення ширини зображення; - Використання атрибута
heightдля визначення висоти зображення.
Розв'язок
<!DOCTYPE html>
<html lang="en">
<head>
<title>Challenge: Images</title>
</head>
<body>
<!-- Image one -->
<img
src="https://content-media-cdn.codefinity.com/courses/c468052d-6d47-4677-b1d1-fb11ace719b1/meadia-%26-tables/adik.png"
alt="Emotion that opens the mouth"
width="256"
height="256"
/>
<!-- Image two -->
<img
src="https://content-media-cdn.codefinity.com/courses/c468052d-6d47-4677-b1d1-fb11ace719b1/meadia-%26-tables/joking.png"
alt="Emotion that shows the tongue"
width="256"
height="256"
/>
</body>
</html>
Все було зрозуміло?
Дякуємо за ваш відгук!
Секція 1. Розділ 18
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат
Секція 1. Розділ 18