Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Lab_html.doc
Скачиваний:
0
Добавлен:
01.05.2025
Размер:
209.41 Кб
Скачать

Лабораторна робота № 5

Web-документи. Мережа Internet

Мета: Уміти створювати прості web-сторінки та надавати їм певного вигляду, використовуючи для цього основні команди мови HTML.

Теоретичні відомості

Web-сторінки створюються за допомогою мови розмітки HTML (yperText Markup Language — Мова розмітки гіпертексту). Документ HTML оброблюється браузером та відтворюється на екрані у звичному для людини вигляді. HTML разом із каскадними таблицями стилів та вбудованими скриптами — це три основні технології побудови веб-сторінок.

HTML впроваджує засоби для:

* створення структурованого документу шляхом позначення структурного складу тексту: заголовки, абзаци, списки, таблиці, цитати та інше;

* отримання інформації із Всесвітньої мережі через гіперпосилання;

* створення інтерактивних форм;

* включення зображень, звуку, відео, та інших об'єктів до тексту.

Документ HTML 4.01 складається з трьох частин:

  1. Декларація типу документу (англ. Document type declaration, Doctype), на початку документа, в якій визначається тип документа (DTD).

  2. Шапка документу (знаходиться в межах елементу head), в якій записано загальні технічні відомості або додаткова інформація про документ, яка не відтворюється безпосередньо в браузері;

  3. Тіло документу (може знаходитися в елементах body або frameset), в якому міститься основна інформація документа.

Нижче наведено приклад загальної структури HTML-документу:

<!doctype HTML public "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<title>Мій перший HTML-документ</title>

</head>

<body>

Hello world!

</body>

</html>

Елементи візуальної розмітки застосовуються задля опису візуальних ефектів тексту, не зазначаючи при цьому функції тексту свого контексту. Остання чинна специфікація HTML 4.01 визначає більшість з цих елементів такими, що не рекомендується застосовувати у розмітці. Наприклад:

Фрагмент HTML-розмітки документа

Відтворення в браузері

<font size="5">Давньогрецькі боги</font>

<br />

<b>Посейдон</b> — володар світових вод, Океану, в латинян йому відповідав <i>Нептун</i>, у слов'ян —

<i>Цар Моря, Цар Морський, Водяник</i>.

Основні теги

Тег означення початок та кінець html-файлу

<HTML>web-сторінка</HTML>

Пара тегів які описують заголовок документа

<HEAD>текст</HEAD>

<TITLE>текст</TITLE> - заголовок Windows-вікна.

Введення коментарів

<!-- текст-коментар -->

або у середині парного тегу

<COMMENT> текст-коментар </COMMENT>

Введення тексту на сторінку

<BODY BACKGROUND="шлях/адреса файлу зображення для тла"

BGCOLOR = "колір тла" TEXT = "колір символів" >

Текст

</BODY>

Теги форматування символів тексту

<В> текст </В>

Товстий шрифт тексту

<І> текст </I>

Шрифт- курсив

<U> текст </U>

Підкреслений шрифт

<SUB> текст </SUB>

Нижній індекс.

<SUP> текст </SUP>

Верхній індекс

<BIG> текст </BIG>

ВЕЛИКИЙ шрифт

<SMALL>текст</SMALL>

Малий шрифт

Створення абзаців

<P Align=left|right|center|justify> <В> текст </В> </P>

Означає початок нового абзацу.

Наступне після тегу <Р> речення починатиметься з нового, вирівняного до лівого краю, абзацу без відступу. Між абзацами буде порожній рядок

<BR>Наступний за цим тегом текст буде наведено у новому рядку без пропуску рядка

Заголовки

<Н№>Заголовок</Н№> - де № - це число яке змінюється від 1 до 6, визначає розмір символів Заголовка (за зменшенням). Починається з абзацу та вирівнюється до лівого краю.

Теги вирівнювання

<CENTER>текст по центру</CENTER>

<LEFT>текст до лівого краю (за умовчанням)</LEFT>

<RIGHT>текст до правого краю</RIGHT>

Рисування горизонтальної лінії

<HR WIDTH =”довжина у пікселяхSIZE=”товщина лінії” COLOR="колір лінії">

Шрифти

<FONT FACE = "назва шрифту" SIZE = розмір шрифту COLOR = "колір">

текст

</FONT>

розміри символів шрифту можуть бути від 1 до 7. (Роз­мір 3 вважається стандартним, він орієнтовно відповідає 10 пунктам).

Тег з відформатованим текстом

<PRE>текст відображатиметься у браузері так як записаний у коді (перехід на рядки, пропуски тощо)</PRE>

Скорочення

<ACRONYM TITLE=”текст розшифровки”> скорочення</ACRONYM>

Основні кольори

black - чорний

#000000

green - зелений

#008000

navy - темно-синій

#000080

teal - бірюзовий

#008080

silver - сірий

#C0C0C0

lime - яскраво-зелений

#C0FF00

blue - синій

#0000FF

aqua - блакитний

#00FFFF

maroon - малиновий

#800000

olive - темно-зелений

#808000

purple - бузковий

#800080

gray - темно-сірий

#808080

red - червоний

#FF0000

yellow - жовтий

#FFFF00

fushsia - рожевий

#FF00FF

while - білий

#FFFFFF

Службові та недруковані символи

&lt

<

&gt

>

&nbsp

Нерозривний пробіл

&amp

&

&laquo &raquo &quot

« » “

&ndash

-

&mdash

--- подовжине тире

&pi

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]