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>
Все було зрозуміло?
Дякуємо за ваш відгук!
Секція 4. Розділ 2
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат
Секція 4. Розділ 2