І.В. Кожух, З.В.Андрушко
Web-технології
Методичні вказівки
для виконання лабораторних робіт
с
тудентами
денного відділення спеціальності
5.05010301 «Розробка програмного забезпечення»
Лабораторні роботи № 1-9
Дрогобицький механіко-технологічний коледж
Web-технології. Методичні вказівки для виконання лабораторних робіт студентами денного відділення спеціальності 5.05010301 «Розробка програмного забезпечення». Лабораторні роботи № 1-9
Дрогобич, видавничий центр коледжу, 2012 – 96 стор.
Рекомендовано до друку
цикловою комісією комп'ютерних дисциплін
спеціальності 5.05010301 «Розробка програмного забезпечення» Протокол №______від___________20__р.
© І.В. Кожух, З.В.Андрушко 2012
ЗМІСТ
ЗМІСТ 3
Лабораторна робота № 1 4
Лабораторна робота № 2 9
Лабораторна робота № 3 13
Лабораторна робота № 4 20
Лабораторна робота № 5 23
Лабораторна робота № 6 34
Лабораторна робота № 7 41
Лаборраторна робота № 8 69
Лаборраторна робота № 9 88
Література: 95
Лабораторна робота № 1
Тема: Створення односторінкового сайту. Виділення даних використовуючи шрифтові оформлення.
Мета: Навчити створювати односторінкові сайти.
Теоретичні відомості
Коли WEB-броузер одержує документ, він визначає, як документ повинен бути інтерпретований. Найперший тег, що зустрічається в документі, повинен бути тегом <HTML>. Даний тег повідомляє WEB-броузеру, що ваш документ написаний з використанням HTML. Мінімальний HTML-документ буде виглядати так:
<HTML> ...тіло документа... </HTML>
Заголовна частина документа <HEAD>
Тег заголовної частини документа повинен бути використаний відразу після тегу <HTML> і більш ніде в тілі документа. Даний тег представляє із себе загальний опис документа. Уникайте розміщувати який-небудь текст усередині тегу <HEAD>. Стартовий тег <HEAD> міститься безпосередньо перед тегом <TITLE> й іншими тегами, що описують документ, а завершальний тег </HEAD> розміщається відразу після закінчення опису документа. Наприклад:
<HTML> <HEAD> <TITLE> Список співробітників </TITLE> </HEAD> ...
Заголовок документа <TITLE>
Більшість WEB-броузерів відображають вміст тегу <TITLE> у заголовку вікна, що містить документ й у файлі закладок, якщо він підтримується WEB-броузером. Заголовок, обмежений тегами <TITLE> й </TITLE>, розміщається усередині <HEAD>-тегів, як показано вище на прикладі. Заголовок документа не з'являється при відображенні самого документа у вікні.
Тіло документа <BODY>
Тіло документа повинне перебувати між тегами <BODY> й </BODY>. Це та частина документа, що відображається як текстова й графічна (основна) інформація вашого документа.
Рівні заголовків <Hx>
Коли пишеться HTML-документ, текст структурно ділиться на просто текст, заголовки частин тексту, заголовки більш високого рівня. Перший рівень заголовків (найбільший) позначається цифрою 1, - 2, і т.д. Більшість броузерів підтримує інтерпретацію шести рівнів заголовків, визначаючи кожному з них власний стиль. Заголовки вище шостого рівня не є стандартом і можуть не підтримуватися броузером. Заголовок самого верхнього рівня має позначку "1". Синтакс заголовка рівня 1 наступний:
<H1> Заголовок першого рівня </H1>
Заголовки іншого рівня можуть бути представлені в загальному випадку так:
<Hx> Заголовок x-го рівня </Hx>
де x - цифра від 1 до 6, що визначає рівень заголовка.
Тег абзацу <P>
У відмінності від більшості текстових процесорів, в HTML-документі звичайно ігноруються символи повернення каретки. Фізичний розрив абзацу може перебувати в будь-якому місці вихідного тексту документа. Однак броузер розділяє абзаци тільки при наявності тега <P>. Якщо ви не розділите абзаци тегом <P>, ваш документ буде виглядати як один великий абзац.
Додаткові параметри тега <P>: <P ALIGN=left|center|right>
дозволяють вирівнювати абзац по лівому краю, центру й правому краю відповідно.