WEBVTT

00:00:00.192 --> 00:00:02.681
Посилання є чудовим способом з'єднати

00:00:02.681 --> 00:00:04.765
одну сторінку з іншою.

00:00:04.765 --> 00:00:07.236
Але вони можуть також з'єднувати 
одну частину сторінки

00:00:07.236 --> 00:00:09.487
з іншою частиною цієї ж сторінки,

00:00:09.487 --> 00:00:13.825
особливо якоїсь довгої,
наприклад, змісту книжки.

00:00:13.825 --> 00:00:16.884
Я додала багато нової
інформації на сторінку,

00:00:16.884 --> 00:00:19.501
щоб познайомити вас з
історією Інтернет-простору

00:00:19.501 --> 00:00:21.848
та історією версій HTML.

00:00:21.848 --> 00:00:26.046
І я думаю, що така кількість
інформації заслуговує на "Зміст".

00:00:26.046 --> 00:00:29.420
Я вже розпочала його створювати,
це невпорядкований список

00:00:29.420 --> 00:00:32.831
з елементами списку —
назвами розділів.

00:00:32.831 --> 00:00:35.226
Я хочу додати посилання
кожному із заголовків,

00:00:35.226 --> 00:00:38.564
щоб ви могли на них натиснути
і перейти до відповідної частини сторінки.

00:00:38.564 --> 00:00:41.701
Щоб зробити це, я знову
використаю тег <а>,

00:00:41.701 --> 00:00:45.112
тому я почну з того, що "обгорну"
заголовок з обох боків

00:00:45.112 --> 00:00:48.564
початковим та кінцевим тегом <а>.

00:00:48.564 --> 00:00:54.624
Отже, яким же має бути href
цього посилання?

00:00:54.624 --> 00:00:57.808
Ми маємо якось сказати браузеру,


00:00:57.808 --> 00:00:59.929
куди на сторінці він має перескочити.

00:00:59.934 --> 00:01:03.313
Якийсь спосіб виокремити
певну частину сторінки.

00:01:03.313 --> 00:01:06.337
Якщо ви вже вивчили, як можна
щось вибрати у CSS,

00:01:06.337 --> 00:01:09.108
ви вже знаєте, як це зробити.

00:01:09.108 --> 00:01:13.766
Ми можемо це зробити, додавши
атрибут 'id' до тега.

00:01:13.766 --> 00:01:18.657
Для цього ми спустимось вниз,
знайдемо заголовок

00:01:18.657 --> 00:01:22.791
і додамо до нього атрибут 'id'.

00:01:22.791 --> 00:01:25.366
Я поставлю курсор в тезі ,

00:01:25.366 --> 00:01:27.429
напишу id="

00:01:27.429 --> 00:01:30.082
і придумаю гарний ідентифікатор,
який буде унікальним,

00:01:30.082 --> 00:01:32.956
наприклад, "веб-історія".

00:01:32.956 --> 00:01:35.776
Добре, повернімось назад до посилання.

00:01:35.776 --> 00:01:39.556
І зараз, щоб сказати браузеру
перейти до внутрішнього посилання,

00:01:39.556 --> 00:01:41.797
ми маємо почати з решітки '#'

00:01:41.797 --> 00:01:45.940
і потім написати такий самий 'id', як і внизу.

00:01:45.940 --> 00:01:48.090
Добре, тепер

00:01:48.090 --> 00:01:51.355
зупиніть це відео
і спробуйте натиснути на посилання.

00:01:51.355 --> 00:01:56.387
Зробіть це, я почекаю.
Клік-клік!


00:01:56.387 --> 00:01:59.575
Гаразд, ви побачили, як посилання
перенесло вас до цього розділу?

00:01:59.575 --> 00:02:01.208
Тоді воно спрацювало!

00:02:01.208 --> 00:02:02.877
Ми можемо додати більше таких посилань,

00:02:02.877 --> 00:02:05.555
додавши атрибути 'id' 
до кожного заголовка

00:02:05.555 --> 00:02:07.705
і створивши теги <а>, 
які на них вказуватимуть.

00:02:07.711 --> 00:02:09.498
Але я залишу це для того, 
щоб ви спробували.

00:02:09.498 --> 00:02:12.153
Важливо пам'ятати, що 'id' мусять
бути унікальними,

00:02:12.153 --> 00:02:15.372
бо інакше браузер не знатиме, 
куди переходити.

00:02:15.372 --> 00:02:17.831
Тому робіть їх гарними і змістовними.

00:02:17.852 --> 00:02:22.062
Переклад на українську мову: Зоряна Гаврилюк, рев'юер: Юлія Білаш, Благодійний фонд "MagneticOne.org"