Поняття мови розмітки гіпертексту.

 HTML  (Hyper Text Markup Language – мова розмітки гіпертексту) – стандартна мова розмітки документів у всесвітній павутині, яка обробляється спеціальними програмами (браузерами)  і відображається у вигляді документа, у зручній для людини формі

Гіпертекст – електронний документ, який містить зв’язки з іншими електронними документами. Такі зв’язки називаються гіперпосиланнями.

Контент – інформаційне наповнення  сайту.

Теги — команди мови HTML.

HTML-теги — це ключові слова або символи, які записуються в кутові дужки.

Теги бувають двох видів: парні й непарні (їх ще називають поодинокими). Парні теги складаються з відкриваючого і закриваючого тегів.

Теги нечутливі до регістра, тому можуть бути написані як великими, так і малими літерами.

Теги розміщуються в дужках <>. 

Атрибути тегів

Більшість тегів мають додаткові властивості або характеристики.

Такі властивості називаються атрибутами (латин. attribuo — надавати, наділяти) і складаються з пари «назва — значення», розділених між собою знаком рівності та записаних у відкриваючому тегу відразу після назви елементу.

<p align=“justify”></p> - параграф вирівнено за шириною (по лівому та правому краями)

Тег абзацу <P>

Теги стилю тексту

Стиль	Елемент або тег	Результат
Bold	<B> Цей текст жирний </B>	Цей текст жирний
Italic	<I> Цей текст похилий </I>	Цей текст похилий
Mono spaced	<TT> Цей текст з непроп. шрифтом </TT>	Цей текст з непроп. шрифтом
Underline	<U> Цей текст підкреслений </U>	Цей текст підкреслений
STRIKE	<S> Цей текст закреслений </S>	Цей текст закреслений

Теги додаткових стилів тексту

Стиль	Елемент або тег	Результат
Big	Цей текст <BIG> великий </BIG>	Цей текст великий
Small	Цей текст <SMALL> маленький </SMALL>	Цей текст маленький
Sub	Цей текст <SUB> підрядковий переклад </SUB>	Цей текст підрядковий переклад
Sup	Цей текст <SUP> надстрочник </SUP>	Цей текст надстрочник

Приклад використання цих тегов:

C<SUB><SMALL>2</SMALL></SUB>H<SUB><SMALL>5</SMALL></SUB>OH
C2H5OH

Тег <FONT> дозволяє довільно визначати розмір шрифту, колір шрифту і вид (family) шрифту. Змінити розмір шрифту можна завданням атрибуту SIZE таким чином

<FONT SIZE="n"> або <FONT SIZE="+n">, <FONT SIZE="-n">

Шрифт може мати розмір від 1 до 7. Ви можете прямо вказати розмір шрифту цифрою, або вказати зсув щодо базового значення (за умовчанням - 3) в позитивну або негативну сторону. Базове значення можна змінити за допомогою тега:

<BASEFONT SIZE="n">

Колір шрифту ви можете змінити за допомогою тега

<FONT COLOR="color"> або <FONT COLOR="#??????">

Кольори можна задавати назвами або завданням кількості червоного, зеленого і синього. У другому випадку перед значенням кольору ставиться #, а потім по два байти кожного кольору (RGB), виражені в шістнадцятковій системі. Основні кольори представлені в таблиці кольорів.

Вид шрифту можна визначати за допомогою тега <FONT FACE="family">, де "family" - назва шрифту. Якщо ви не указуєте назву шрифту або якщо вказаний вами шрифт не встановлений в системі - браузер відобразить текст шрифтом встановленим за умовчанням. Найбільш стандартними шрифтами є: ARIAL, TIMES, COURIER.

Приклад використання тега:

<FONT FACE="COURIER" SIZE="+1" COLOR="green">Трохи зеленого тексту</FONT>
Трохи зеленого тексту

Завдання 1

Створити найпростішу web-сторінку  проба.html

Завдання 2

В тіло сторінки в кожному окремому рядку ввести 

- Прізвище , ім'я,

- Дату народження

- адресу проживання

- місце навчання

Для кожного рядка використовувати різні теги стилю 

Завдання 3.

1. Створити документ HTML. 

2. В створений документ HTML внести наступний код:

Збережіть зміни в текстовому файлі. Виконайте команду Файл - Зберігти.

3. Відкрийте створений файл в програмі інтернет-браузера. Продивіться отриману веб-сторінку.

4. Самостійно створіть сторінку, використовуючи різні шрифти, параметри абзацу і кольорове забарвлення. 

Завдання 4

1. Створити папку .
2. В папку помістити малюнок (1.jpg), який буде фоном сторінки і малюнок (2.jpg), який буде розміщено під текстом.
3. У своїй папці створити текстовий документ (редактора Блокнот) і записати теги і текст фрагмента веб-сторінки:

<html>

   <head>

      <title> Свято програмістів </title>

   </head>

   <body background="1.jpg">

   <h1 align="center">

         <b> <font color=blue> День програміста

         </font>  </b>

    </h1>

<p> Професійне свято програмістів

<font color=red size=+2> Міжнародний день програмістів </font> відзначають

<font color=red size=+2> 7 січня </font> щорічно. Це свято пов’язане з надзвичайно важливою на сьогодні професією.

Люди, що займаються програмуванням, суттєво полегшують наше життя, даючи команди автоматизованим машинам. <br>

Можна зустріти й інший варіант дати – День комп’ютерника і програміста,

що відзначають на 256 день року, адже саме таке число відповідає максимальній кількості чисел, які можна виразити за допомогою 1 байта.

Але IT-спільнота України відмовилась від його святкування через те, що воно мало російське коріння і сновним святом став саме

Міжнародний день програмістів 7 січня.

</p>

<p align="center">

<img src="2.jpg"></p>

</body>

</html>

 

4. Зберегти текстовий документ з розширенням txt (щоб можна було редагувати).
5. Зберегти документ з розширенням html і відкрити за допомогою браузера.