WEBVTT

00:00:00.633 --> 00:00:02.766
Ви знаєте, що я люблю? Списки!

00:00:02.766 --> 00:00:05.133
Ви коли-небудь робили список покупок 
або завдань?

00:00:05.133 --> 00:00:07.342
Ви коли-небудь читали списки 
на веб-сайтах?

00:00:07.342 --> 00:00:10.401
Наприклад,
"Топ-10 Найсмішнішніх Собачих Мордочок"?

00:00:10.401 --> 00:00:13.700
Я впевнена, ви бачили, тому що
світ наповнений списками.

00:00:13.700 --> 00:00:16.100
HTML дає нам декілька тегів для 
створення списків,

00:00:16.100 --> 00:00:18.966
і ми зараз трішки попрактикуємось з ними,

00:00:18.966 --> 00:00:23.963
створивши список причин, чому кролики
є прекрасними тваринками.

00:00:24.600 --> 00:00:27.133
Отже, щоб створити маркований список,

00:00:27.133 --> 00:00:30.486
ми повинні почати з тега < ul >.

00:00:30.502 --> 00:00:32.433
Що означає тег < ul >?

00:00:32.433 --> 00:00:36.100
Я закладаюсь, ви можете здогадатись,
що "l" – це список (англ. "List").

00:00:36.100 --> 00:00:39.933
З "u" – трохи складніше, ця літера означає
"невпорядкований" (англ."unordered"),

00:00:39.933 --> 00:00:42.800
і це означає, що браузер 
не нумеруватиме елементи списку.

00:00:42.800 --> 00:00:45.066
Він всього лиш додаватиме 
маленькі маркери.

00:00:45.066 --> 00:00:48.367
Щоб побачити, що я маю на увазі,
давайте додамо перший елемент.

00:00:48.367 --> 00:00:50.200
"Вони – пухнасті".

00:00:50.200 --> 00:00:52.111
Бачите маленький кружечок збоку?

00:00:52.111 --> 00:00:53.268
Це і є маркер.

00:00:53.268 --> 00:00:55.933
Як ви думаєте, що означає < li >?

00:00:55.933 --> 00:00:59.933
"l" – це список (англ. list), "і" - це елемент
(англ. item), елемент списку.

00:00:59.933 --> 00:01:01.700
Кожного разу, коли ми хочемо додати 
новий елемент,

00:01:01.700 --> 00:01:05.633
ми маємо додати новий тег < li > під тегом < ul > .

00:01:05.633 --> 00:01:08.500
Кожен тег < ul > має мати хоча б
один тег < li > під собою,

00:01:08.500 --> 00:01:11.833
тому що список без елементів - 
це дуже нудно.

00:01:11.833 --> 00:01:13.733
Добре, давайте додамо ще щось.

00:01:13.733 --> 00:01:17.366
"Хороші слухачі" і...

00:01:17.366 --> 00:01:21.535
"Їдять всі твої залишки моркви".

00:01:22.146 --> 00:01:24.933
Гаразд, думаю, це буде дуже 
переконливий список.

00:01:24.933 --> 00:01:28.433
Думаю, прочитавши це, 
коже би захотів завести собі кролика.

00:01:28.433 --> 00:01:30.000
Я не пронумерувала список,

00:01:30.000 --> 00:01:31.767
тому що не вважаю,
що одна причина

00:01:31.767 --> 00:01:33.600
є важливішою за іншу,

00:01:33.600 --> 00:01:36.666
але існує багато випадків,
коли нам потрібно створити нумерований список.

00:01:36.666 --> 00:01:38.133
Наприклад, якщо б
ми захотіли створити список:

00:01:38.133 --> 00:01:43.133
"Топ-3 найвідоміших кроликів".

00:01:44.866 --> 00:01:47.233
Для того, щоб створити нумерований список,

00:01:47.233 --> 00:01:51.166
ми використаємо тег < ol > замість < ul > .

00:01:51.166 --> 00:01:54.633
Ви здогадались, що означає < ol > ?

00:01:54.633 --> 00:01:56.281
Ось підказка, просто відкиньте 


00:01:56.281 --> 00:01:59.233
дві перші літери від слова, 
яке було означенням < ul >.

00:01:59.233 --> 00:02:02.633
Правильно, ці літери означають 
"впорядкований список" (англ. "ordered list").

00:02:02.633 --> 00:02:04.566
І цей тег каже браузеру автоматично

00:02:04.566 --> 00:02:06.533
нумерувати кожен новий елемент списку.

00:02:06.533 --> 00:02:09.500
Далі ми використовуємо тег < li >, 
для того щоб додати

00:02:09.500 --> 00:02:11.733
нові елементи у список.

00:02:11.733 --> 00:02:13.400
Тому ми напишемо "Багс Банні",

00:02:13.400 --> 00:02:15.866
далі "Тампер",

00:02:15.866 --> 00:02:19.300
і, звичайно, ми не можемо 
забути про "Різдвяного кролика".

00:02:20.988 --> 00:02:22.533
В нумерованому списку важливе те,

00:02:22.533 --> 00:02:25.033
що браузер сам створює для нас
нумерацію.

00:02:25.033 --> 00:02:27.733
Тому, якщо ми по-іншому впорядкуємо 
список, видалимо або додамо нові елементи,

00:02:27.733 --> 00:02:30.400
він завжди правильно розставить наші числа.

00:02:30.400 --> 00:02:32.133
Наприклад, якщо ви всі скажете,

00:02:32.133 --> 00:02:33.800
що не знаєте, хто такий Тампер.

00:02:33.800 --> 00:02:35.933
Тоді спочатку я вам скажу,

00:02:35.933 --> 00:02:37.400
що ви маєте переглянути "Бембі".

00:02:37.400 --> 00:02:39.300
Але потім я неохоче пересуну

00:02:39.300 --> 00:02:41.233
Тампера в самий низ.

00:02:41.233 --> 00:02:44.466
І зараз бідний Тампер є третім номером.

00:02:44.466 --> 00:02:47.133
Отже, зараз ви маєте все,
щоб створювати списки.

00:02:47.133 --> 00:02:50.329
Тож вперед! Складайте списки!

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