[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.28,0:00:02.66,Default,,0000,0000,0000,,Я створила цю сторінку\Nпро моїх домашніх тваринок
Dialogue: 0,0:00:02.66,0:00:04.34,Default,,0000,0000,0000,,зі списком їхніх імен.
Dialogue: 0,0:00:04.34,0:00:06.75,Default,,0000,0000,0000,,Коли ви дивитесь на цей список,\Nщо вас цікавить?
Dialogue: 0,0:00:06.75,0:00:11.11,Default,,0000,0000,0000,,Я мала тваринок на ім'я Чорний-і-Білий,\NДемон і Ангел.
Dialogue: 0,0:00:11.11,0:00:12.96,Default,,0000,0000,0000,,Але, що це були за тваринки?
Dialogue: 0,0:00:12.96,0:00:14.55,Default,,0000,0000,0000,,Якого вони були кольору?
Dialogue: 0,0:00:14.55,0:00:16.12,Default,,0000,0000,0000,,Якого вони віку?
Dialogue: 0,0:00:16.12,0:00:18.32,Default,,0000,0000,0000,,Мені, напевно, слід дати вам \Nбільше інформації
Dialogue: 0,0:00:18.32,0:00:21.05,Default,,0000,0000,0000,,про тваринок у цьому списку,\Nщоб відповісти на ваші питання.
Dialogue: 0,0:00:21.05,0:00:23.46,Default,,0000,0000,0000,,Я можу зробити це, створивши\Nвкладений список,
Dialogue: 0,0:00:23.46,0:00:26.82,Default,,0000,0000,0000,,або додавши інформацію в дужках,
Dialogue: 0,0:00:26.82,0:00:30.33,Default,,0000,0000,0000,,щоб ви знали, що Білий-і-Чорний\Nбув кроликом,
Dialogue: 0,0:00:30.33,0:00:32.21,Default,,0000,0000,0000,,Демон — це кіт
Dialogue: 0,0:00:32.21,0:00:34.20,Default,,0000,0000,0000,,і Ангел - це також кіт.
Dialogue: 0,0:00:34.73,0:00:37.38,Default,,0000,0000,0000,,Але мені так не подобається,\Nтому що все це виглядає дуже не організовано,
Dialogue: 0,0:00:37.38,0:00:40.91,Default,,0000,0000,0000,,і я не можу просто пробігтись\Nвниз по сторінці і побачити всі види
Dialogue: 0,0:00:40.91,0:00:42.79,Default,,0000,0000,0000,,в одному гарно упорядкованому списку.
Dialogue: 0,0:00:42.79,0:00:47.35,Default,,0000,0000,0000,,Для цього найкращим варіантом\Nбуде створити таблицю
Dialogue: 0,0:00:47.35,0:00:49.14,Default,,0000,0000,0000,,з рядком для кожної тваринки
Dialogue: 0,0:00:49.14,0:00:51.86,Default,,0000,0000,0000,,і стовпчиком для кожної \Nхарактеристики тварини,
Dialogue: 0,0:00:51.86,0:00:54.08,Default,,0000,0000,0000,,якою я хочу з вами поділитись.
Dialogue: 0,0:00:54.08,0:00:58.38,Default,,0000,0000,0000,,Для створення таблиць в HTML\Nнам знадобиться багато тегів.
Dialogue: 0,0:00:58.38,0:00:59.96,Default,,0000,0000,0000,,Тому приготуйтесь!
Dialogue: 0,0:00:59.96,0:01:02.56,Default,,0000,0000,0000,,І не хвилюйтесь про те, що вам\Nпотрібно запам'ятати стільки тегів.
Dialogue: 0,0:01:02.56,0:01:04.43,Default,,0000,0000,0000,,Ви завжди можете переглянути \Nїх пізніше.
Dialogue: 0,0:01:04.43,0:01:07.19,Default,,0000,0000,0000,,Мені потрібно було 10 років, щоб \Nзапам'ятати усі теги таблиць,
Dialogue: 0,0:01:07.19,0:01:08.61,Default,,0000,0000,0000,,і зараз я професіонал.
Dialogue: 0,0:01:08.61,0:01:10.44,Default,,0000,0000,0000,,Добре, почнімо!
Dialogue: 0,0:01:10.44,0:01:15.08,Default,,0000,0000,0000,,Перший тег —  (таблиця),
Dialogue: 0,0:01:15.08,0:01:20.02,Default,,0000,0000,0000,,Далі, нам потрібно верхнє поле таблиці,\Nде будуть вказані назви стовпців.
Dialogue: 0,0:01:20.02,0:01:23.04,Default,,0000,0000,0000,,Тому ми пишемо  (table head).
Dialogue: 0,0:01:23.04,0:01:27.86,Default,,0000,0000,0000,,Всередині цього поля ми, як правило, хочемо \Nстворити лише один рядок з комірками.
Dialogue: 0,0:01:27.86,0:01:32.00,Default,,0000,0000,0000,,Щоразу як ми додаємо рядок в таблицю,\Nми використовуємо тег  (table row - рядок таблиці).
Dialogue: 0,0:01:32.00,0:01:35.29,Default,,0000,0000,0000,,Всередині цього рядка ми хочемо додати\Nкомірки з назвами стовпців.
Dialogue: 0,0:01:35.29,0:01:41.68,Default,,0000,0000,0000,,Для однієї комірки з назвою \Nми пишемо тег .
Dialogue: 0,0:01:41.68,0:01:44.88,Default,,0000,0000,0000,,Добре, якою буде назва першого стовпця?
Dialogue: 0,0:01:44.88,0:01:49.09,Default,,0000,0000,0000,,Це буде "ім'я тваринки", оскільки це \Nнайважливіша інформація в рядку
Dialogue: 0,0:01:49.09,0:01:51.31,Default,,0000,0000,0000,,та ідентифікатор для нього.
Dialogue: 0,0:01:51.31,0:01:54.70,Default,,0000,0000,0000,,Тепер ми додамо ще один стовпець\Nпід назвою "Види".
Dialogue: 0,0:01:54.70,0:01:58.60,Default,,0000,0000,0000,,І насамкінець, стовпець для кольору.
Dialogue: 0,0:01:58.60,0:02:01.53,Default,,0000,0000,0000,,Думаю, для початку достатньо стовпців,
Dialogue: 0,0:02:01.53,0:02:03.92,Default,,0000,0000,0000,,тому зараз час додати дані.
Dialogue: 0,0:02:03.92,0:02:05.95,Default,,0000,0000,0000,,Ми розпочнемо рядки з даними\N
Dialogue: 0,0:02:05.95,0:02:09.47,Default,,0000,0000,0000,,з тега  під тегом ,
Dialogue: 0,0:02:09.47,0:02:11.85,Default,,0000,0000,0000,,і потім, оскільки нам знову потрібен\Nрядок,
Dialogue: 0,0:02:11.85,0:02:14.28,Default,,0000,0000,0000,,ми використаємо тег .
Dialogue: 0,0:02:14.28,0:02:16.72,Default,,0000,0000,0000,,Але всередині, замість використання ,
Dialogue: 0,0:02:16.72,0:02:20.00,Default,,0000,0000,0000,,ми використаємо , \Nтому що ми працюємо в основній частині.
Dialogue: 0,0:02:20.00,0:02:23.14,Default,,0000,0000,0000,,Ми напишемо , що означає \N"дані таблиці" (tabular data).
Dialogue: 0,0:02:23.14,0:02:26.47,Default,,0000,0000,0000,,І яке ж значення має бути \Nв першій клітинці
Dialogue: 0,0:02:26.47,0:02:28.06,Default,,0000,0000,0000,,в першому рядку даних?
Dialogue: 0,0:02:28.06,0:02:30.31,Default,,0000,0000,0000,,Що ж, я прогляну свій список
Dialogue: 0,0:02:30.31,0:02:33.80,Default,,0000,0000,0000,,і побачу, що першим елементом\Nв моєму списку був Чорний-і-Білий,
Dialogue: 0,0:02:33.80,0:02:36.02,Default,,0000,0000,0000,,і це ім'я тваринки,
Dialogue: 0,0:02:36.02,0:02:40.26,Default,,0000,0000,0000,,тому я просто напишу "Чорний-і-Білий".
Dialogue: 0,0:02:40.26,0:02:42.50,Default,,0000,0000,0000,,Переходимо до другого тега .
Dialogue: 0,0:02:42.50,0:02:46.73,Default,,0000,0000,0000,,Ми можемо подивитись вгору і побачити,\Nщо другим  були види,
Dialogue: 0,0:02:46.73,0:02:49.72,Default,,0000,0000,0000,,а Чорний-і-Білий був кроликом,
Dialogue: 0,0:02:49.72,0:02:52.50,Default,,0000,0000,0000,,тому ми напишемо "кролик".
Dialogue: 0,0:02:52.50,0:02:55.16,Default,,0000,0000,0000,,І насамкінець, третій тег .
Dialogue: 0,0:02:55.16,0:02:58.09,Default,,0000,0000,0000,,Ми подивимось вгору і побачимо,\Nщо третім  був колір.
Dialogue: 0,0:02:58.09,0:03:00.18,Default,,0000,0000,0000,,І відповідний ...
Dialogue: 0,0:03:00.18,0:03:04.43,Default,,0000,0000,0000,,я була не дуже креативною дитиною,\Nколи називала кролика,
Dialogue: 0,0:03:04.43,0:03:08.22,Default,,0000,0000,0000,,тому ви, напевно, вгадали кольори.
Dialogue: 0,0:03:08.22,0:03:10.77,Default,,0000,0000,0000,,Добре, зробімо наступний рядок.
Dialogue: 0,0:03:10.77,0:03:13.07,Default,,0000,0000,0000,,Я вам покажу одну маленьку хитрість.
Dialogue: 0,0:03:13.07,0:03:15.54,Default,,0000,0000,0000,,Що мені подобається... після того\Nяк я зробила один рядок,
Dialogue: 0,0:03:15.54,0:03:17.13,Default,,0000,0000,0000,,я вибираю його
Dialogue: 0,0:03:17.13,0:03:19.39,Default,,0000,0000,0000,,і копіюю його, використовуючи\N"гарячі клавіші",
Dialogue: 0,0:03:19.39,0:03:22.59,Default,,0000,0000,0000,,якими є переважно ctr+C або command+C,
Dialogue: 0,0:03:22.59,0:03:24.54,Default,,0000,0000,0000,,залежно від вашої операційної системи.
Dialogue: 0,0:03:24.54,0:03:28.64,Default,,0000,0000,0000,,Потім я вставляю цей рядок,\Nтакож використовуючи "гарячі клавіші",
Dialogue: 0,0:03:28.64,0:03:31.08,Default,,0000,0000,0000,,якими є ctr+V або command+V,
Dialogue: 0,0:03:31.08,0:03:33.04,Default,,0000,0000,0000,,залежно від вашої операційної системи.
Dialogue: 0,0:03:33.04,0:03:36.87,Default,,0000,0000,0000,,І після того як я вставлю його,\Nя просто зміню значення.
Dialogue: 0,0:03:36.87,0:03:41.78,Default,,0000,0000,0000,,Цей буде Демоном, котом і чорним.
Dialogue: 0,0:03:41.78,0:03:44.40,Default,,0000,0000,0000,,І потім ми зробимо це ще раз,
Dialogue: 0,0:03:44.40,0:03:52.70,Default,,0000,0000,0000,,і цей буде Ангелом, котом і жовтогарячим.
Dialogue: 0,0:03:52.70,0:03:55.61,Default,,0000,0000,0000,,Гаразд, насправді, доволі нудно
Dialogue: 0,0:03:55.61,0:03:59.07,Default,,0000,0000,0000,,писати ці всі теги  і  знову і знову,
Dialogue: 0,0:03:59.07,0:04:03.29,Default,,0000,0000,0000,,тому ця хитрість "копіювати-вставити"\Nможе зробити все трохи менш нудним.
Dialogue: 0,0:04:03.30,0:04:05.85,Default,,0000,0000,0000,,І от ми її створили: таблицю.
Dialogue: 0,0:04:05.85,0:04:08.04,Default,,0000,0000,0000,,Я можу легко додати ще стовпців,
Dialogue: 0,0:04:08.04,0:04:10.55,Default,,0000,0000,0000,,додавши інші теги  до верхнього поля,
Dialogue: 0,0:04:10.55,0:04:12.83,Default,,0000,0000,0000,,а потім ще теги  до кожного з рядків,
Dialogue: 0,0:04:12.83,0:04:16.14,Default,,0000,0000,0000,,якщо я хочу розповісти більше деталей\Nпро своїх тваринок.
Dialogue: 0,0:04:16.14,0:04:19.66,Default,,0000,0000,0000,,І вам, мабуть, цікаво, як ви\Nможете змінити вигляд таблиці,
Dialogue: 0,0:04:19.66,0:04:22.21,Default,,0000,0000,0000,,наприклад контури, кольори\Nчи масштаби.
Dialogue: 0,0:04:22.21,0:04:24.67,Default,,0000,0000,0000,,Ви можете це все зробити\Nза допомогою властивостей CSS,
Dialogue: 0,0:04:24.67,0:04:27.77,Default,,0000,0000,0000,,які ви вже вивчити\Nабо вивчите пізніше.
Dialogue: 0,0:04:27.77,0:04:31.46,Default,,0000,0000,0000,,А тепер спробуйте на основі цієї сторінки\Nстворити свою зі своїми власними
Dialogue: 0,0:04:31.46,0:04:33.29,Default,,0000,0000,0000,,домашніми тваринками або з тваринками,\Nяких би ви хотіли мати.
Dialogue: 0,0:04:33.29,0:04:35.13,Default,,0000,0000,0000,,Зробіть з цих даних таблицю!
Dialogue: 0,0:04:35.13,0:04:39.36,Default,,0000,0000,0000,,Переклад на українську мову: Зоряна Гаврилюк, рев'юер: Юлія Білаш, Благодійний фонд "MagneticOne.org"