Сторінки

субота, 22 жовтня 2022 р.

Використання зображень у веб-документах.

 Перегляньте Презентація 

Перегляньте відео!!!

Онлайн редактор HTML коду (+ CSS)   Редактор HTML CSSDesk

Практична частина

  • Створити веб сторінку з символікою України.
  • Задати заголовок сторінки та підзаголовки (використовуємо теги h1 та h2). 
  • Додати текст гімну.

Хід виконання:

  1. Створити сторінку  з назвою image.html
  2. У створеному документі створити структуру пустої веб сторінки.
  3. Завантажити із Інтернету зображення герба та прапора України.
  4. Використовуючи теги заголовків та зображень сформувати сторінку відповідно завдання.
  5. Зберегти створений документ та перевірити його працездатність.

Теги для роботи з графікою:

Тег <img> призначений для відображення на веб-сторінці зображень в графічному форматі GIF, JPEG або PNG. Адреса файлу з картинкою задається через атрибут src. Якщо необхідно, то малюнок можна зробити посиланням на інший файл, помістивши тег <img> в контейнер <a>. При цьому навколо зображення відображається рамка, яку можна прибрати, додавши атрибут border = "0" в тег <img>.

Синтаксис:

<img src="/URL" alt="альтернативний текст">

Атрибути:

align - Визначає як малюнок буде вирівнюватися по краю і спосіб обтікання текстом.

alt - Альтернативний текст для зображення.

border - Товщина рамки навколо зображення.

height - Висота зображення.

hspace - Горизонтальний відступ від зображення до навколишнього контенту.

lowsrc - Адреса зображення низької якості.

src - Шлях до графічного файлу.

vspace - Вертикальний відступ від зображення до навколишнього контенту.

width - Ширина зображення.

Приклад коду сторінки із зображенням:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>Тег IMG</title>

</head>

<body> 

<p><a href="/lorem.html"><img src="/images/girl.png" width="189" height="255" alt="lorem"></a>Lorem ipsum dolor sit amet...</p>

</body>

</html>

Немає коментарів:

Дописати коментар