- •Міністерство освіти і науки України
- •Поради при створенні Web-сторінки
- •Завдання до лабораторних робіт
- •Лабораторна робота №1 Простий документ html. Форматування тексту
- •Завдання до лабораторної роботи №1 для самостійного виконання
- •Студент групи *-ек а.П.Іванов Лабораторна робота №2 Графіка
- •Завдання до лабораторної роботи №2 для самостійного виконання
- •Лабораторна робота №3 Таблиці
- •Завдання до лабораторної роботи №3 для самостійного виконання
- •Лабораторна робота №4 Списки
- •Завдання до лабораторної роботи №4 для самостійного виконання
- •Лабораторна робота №5 Гіпертекстові посилання
- •Завдання до лабораторної роботи №5 для самостійного виконання
- •Лабораторна робота №6 Сенсорні зображення
- •Завдання до лабораторної роботи №6 для самостійного виконання
- •Лабораторна робота №7 Створення і використання форм
- •Завдання до лабораторної роботи №7 для самостійного виконання
- •Лабораторна робота №8 Фрейми
- •Завдання до лабораторної роботи №8 для самостійного виконання
- •Використана література
Завдання до лабораторної роботи №1 для самостійного виконання
Створіть Web-сторінку з іменем myself.html, яка б містила такі заголовки: “Про себе”, “Моє хобі”. У цих розділах напишіть 2-3 абзаци осмисленого тексту, який був би вирівняний по ширині вікна. Визначте колір фону, тексту, а також гарнітуру. Всередині тексту використайте виділення слів жирним курсивом та підкресленням. Використайте різні теги форматування тексту.
Додайте у розділ “Моє хобі” заголовок другого рівня “Програмування” та розмістіть під ним невеликий текст програми, на тій мові програмування, яку ви вивчаєте із збереженням усіх відступів, інтервалів і перенесень строчок. Додайте до документа підпис, відформатований як у прикладі:
Студент групи *-ек а.П.Іванов Лабораторна робота №2 Графіка
Як правило, броузери підтримують малюнки у форматах GIF та JPG. Формат GIF використовується для збереження малюнків із чіткими деталями, невеликим набором кольорів (до 256) і можливістю анімації. Крім того, цей формат підтримує ефект прозорості, а також можливість черезстрочного завантаження зображення. Формат JPG використовується для збереження повнокольорової графіки і фото (він підтримує 16,7 мільйона кольорів). При підготовці ілюстрацій для вашої Web-сторінки усю попередню обробку малюнка потрібно проводити, наприклад, у форматі BMP, а у формат GIF та JPG конвертується лише кінцевий варіант.
Завдання 1. Розміщення графіки на Web-сторінці.
Графічне зображення вставляється у документ HTML за допомогою тега:
<IMG SRC="URL малюнка" WIDTH="ширина" HEIGHT="висота" BORDER="рамка" ALIGN="вирівнювання" HSPACE="відступ по горизонталі" VSPACE="відступ по вертикалі" ALT="текст">
Закривати тег не потрібно. При виконанні завдання будемо вважати, що графічний файл clock.jpg знаходиться у вашому робочому каталозі, де і Web-сторінка.
<HTML>
<HEAD>
<TITLE> Навчальний файл HTML</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#330066">
<P ALIGN="CENTER">
<FONT COLOR="#008080" SIZE="7"><B>
Розклад </B></FONT><BR>
<FONT SIZE="6"><I>занять на вівторок </I></FONT>
<BR><BR>
<IMG SRC="CLOCK.JPG">
</P>
</BODY>
</HTML>
Завдання 2. Установлення фонового зображення на Web-сторінці.
Графіка, що використовується як фон, задається в тегові <BODY> за допомогою атрибута BACKGROUND.
<HTML>
<HEAD>
<TITLE> Навчальний файл HTML</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</HEAD>
<BODY BACKGROUND="backgrnd.gif" TEXT="#330066">
<P ALIGN=CENTER>
<FONT COLOR="#008080"SIZE="7"><B>
Розклад </B></FONT><BR>
<FONT SIZE="6"> <I> занять на вівторок </I>
</FONT>
</Р>
</BODY>
</HTML>
Завдання до лабораторної роботи №2 для самостійного виконання
Створіть за допомогою редактора Paint малюнок (вашу емблему), конвертуйте його з формату bmp у формат jpg і розмістіть на вашій сторінці myself.html.
Створіть Web-сторінку про групу, в якій ви навчаєтесь (про своїх друзів), та встановіть на ній фонове зображення.
Під іменем foto.html створіть Web-сторінку, на котрій розмістіть фотографії з надписами. Використайте такі атрибути, як ALT, BORDER, HEIGHT, WIDTH.