Створення сайту

Головна 1. Початок роботи	2. Мова 3. Текст	4. Прикраси 5. Зображення	6. Таблиця 7. Список	8. Гіперпосилання 9. Галерея	10. Корисне 11. Зв'язок

	Зображення на сайті

Марта запитала про додавання зображення. Це дуже вчасно. Жодна веб-сторінка зараз не обходиться без зображень!
— Пане Веб, а додавати зображення - це складно?
— Ні, Лесику, ми це зробимо за допомогою тегів вставки зображень <IMG> — це непарний тег, він має параметри:

Параметри тега <IMG>	Пояснення
src=pict.jpg	параметр src - обов'язковий параметр, вказує якій саме файл зображення треба відобразити на сторінці, цей файл повинен бути у тій же папці, де знаходяться файли сайту.
border=n	параметр визначає товщину чорної рамки зображення у пікселях, чим більше значення - тим товще рамка. Можна задавати будь-яке значення.
width=n	параметр визначає ширину зображення у пікселях або відсотках. Зауваження: висота зображення перераховується браузером автоматично.

—Пане Веб, а як же це все написати нам з Лесиком на сторінці?
—Марта, спочатку треба знайти зображення та скопіювати файл зображення у папку з сайтом. А потім діємо.

Діємо!
1. Працюємо у відкритому файлі index.html
2. Перед тегом рухомого рядку додаємо теги вставки зображення, як на малюнку 15. Слідкуємо, щоб файл зображення (у прикладі це файл rs1.jpg) був у папці site.
3. У меню програми обрати пункт Файл—Зберегти. Файл не закривати!
4. Перейти до відкритого файла у браузері. Та у відкритому вікні натиснути кнопку Оновити (заокруглена стрілочка біля рядку адреси або клавіша на клавіатурі з написом F5 ) На сторінці з'явилося зображення, приблизно, як на малюнку 16? Вітаю! Всі дії зроблено вірно!

—Пане Веб, сторінка виглядає дуже яскраво! Ми вже уміємо робити все, так Пане Веб?
—Марта, ви з Лесиком молодці, але це не все. Далі розглянемо додавання таблиці .

мал. 15 Щоб збільшити зображення натисні на ньому лівою кнопкою миші

мал. 16 Щоб збільшити зображення натисні на ньому лівою кнопкою миші

Головна 1. Початок роботи	2. Мова 3. Текст	4. Прикраси 5. Зображення	6. Таблиця 7. Список	8. Гіперпосилання 9. Галерея	10. Корисне 11. Зв'язок