5 урок

При використанні web сторінк, деколи потрібно перейти до конкретного місця, особливо коли сторінка займає декілька екранів.
Щоб помітити цей тег, до якого порібно перейти. використовують атрибут id="індентифікатор тегу"
Ідентифікатор повинен обов'язково починатися з латинської символу і може містити в собі
латинські букви (A-Z, a-z), цифри (0-9), символ дефіса (-) і підкреслення (_).
!!Використання букв кирилиці в іменах ідентифікатора неприпустимо.

Наприклад.
<hr id="m1">
<img src="Mal1.jpg">

Щоб перенести курсор до тегу позначеного індентифікатором використовують
тег гіперпосилання.<a href="#індентифікатор">Перейти до першої мітки</a>

Завдання 1.
- Створіть сторінку із любим текстом, який займав би 3 екрани
- Розділіть кожен екран тегом <hr> з відповідними мітками m1, m2, m3
- На початку кожного екрану вставте меню з гіперпосилань:
<a href="#m1">Перехід до 1 мітки</a> <a href="#m2">Перехід до 1 мітки</a> <a href="#m3">Перехід до 1 мітки</a>
- Скопіюйте меню біля кожної мітки.
Тепер на Вашій вебсторінці можна швидко переходити між екранами.
Якщо в якості індетифікатора в тезі гіперпосилання використати доменну адресу сайту, то браузер перейде за цією адресою і завантажить його.
<a href="www.vpu14.ho.ua">Сайт училища №14 м. Коломиї</a>
Замість доменної адреси можна викорисовувати просто шлях до файлу та його імя.
<a href="mal.png">Сайт училища №14 м. Коломиї</a>
<a href="1.html">Сайт училища №14 м. Коломиї</a>

Завдання 2.
- Створіть 3 вебсторінки 1.html, 2.html, 3.html
- В кожній вебсторінці вставте малюнок і назву, відповідно: 1 сторінка, 2 сторінка,3 сторінка - На початку кожного екрану вставте меню з гіперпосилань:
<a href="1.html">1 сторінка</a> <a href="2.html">2 сторінка</a> <a href="3.html">3 сторінка</a>
- Завантажте в браузер любу із цих сторінок і опробуйте меню.
- Застосуйте до тегу гіперпосилань атрибут target="_blank"
<a href="1.html " target="_blank">1 сторінка</a>
<a href="2.html " target="_blank">2 сторінка</a>
<a href="3.html " target="_blank">3 сторінка</a>
Як працює цей атрибут?

Нумеровані списки записуються між тегом <ol>
, Кожен пункт нумерованого списку позначається тегом <li>, як показано нижче. Завдання 3.
- Скопіюйте цей код до файлу 4.html


<Html> 
<Head>
<Title> Списки </title>
</Head>
<Body>
<OL>
 <Li> Перший пункт </Li>
 <Li> Другий пункт </Li>
 <Li>Третій пункт </Li>
<OL>
</Body>
</Html>

- Випробуйте до тега <OL> почергово атрибути:
type="1", type="A", type="a", type="I", type="i"

Маркований список формується за допомогою тега <UL>, а кожен пункт списку починається з тега<li>
Завдання 4.
- Скопіюйте цей код до файлу 5.html

<Html> <Head> <Title> Списки </title> </Head> <Body> <UL> <Li> Перший пункт </Li> <Li> Другий пункт </Li> <Li>Третій пункт </Li> <UL> </Body> </Html>

- Випробуйте до тега <OL>почергово атрибути:
type="disc",type="circle",type="square"

Повернутись на початок сторінки

Виготовлено в 2020 році