[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.21,0:00:05.22,Default,,0000,0000,0000,,Ви вже бачили, як можна змінити колір\Nтексту та фону на сторінці. Dialogue: 0,0:00:05.30,0:00:08.68,Default,,0000,0000,0000,,Але ви можете зробити значно\Nбільше з текстом у CSS. Dialogue: 0,0:00:09.51,0:00:11.63,Default,,0000,0000,0000,,Спочатку, змінімо шрифт. Dialogue: 0,0:00:12.58,0:00:15.92,Default,,0000,0000,0000,,Що таке шрифт? Ви точно знаєте,\Nщо це, але, можливо, Dialogue: 0,0:00:15.92,0:00:17.28,Default,,0000,0000,0000,,ви не знали, як це називається. Dialogue: 0,0:00:17.28,0:00:19.86,Default,,0000,0000,0000,,Це стиль літер, які формують слова: Dialogue: 0,0:00:19.86,0:00:23.20,Default,,0000,0000,0000,,чи є у них певні оздоблення,\Nнаскільки тонкими є літери, Dialogue: 0,0:00:23.20,0:00:25.90,Default,,0000,0000,0000,,чи, можливо, вони наче написані \Nчорнильною ручкою. Dialogue: 0,0:00:25.90,0:00:30.27,Default,,0000,0000,0000,,Буде простіше, якщо я почну діяти\Nі зміню шрифти на цій сторінці. Dialogue: 0,0:00:30.66,0:00:35.44,Default,,0000,0000,0000,,Я перейду до правила CSS "p", яке\Nвибирає усі параграфи, Dialogue: 0,0:00:35.73,0:00:37.96,Default,,0000,0000,0000,,і додам тут властивість "font-family"\N(сімейства шрифтів). Dialogue: 0,0:00:38.28,0:00:41.28,Default,,0000,0000,0000,,font-family: sans-serif. Dialogue: 0,0:00:41.74,0:00:43.83,Default,,0000,0000,0000,,Чи ви бачите, як змінились літери? Dialogue: 0,0:00:44.12,0:00:45.80,Default,,0000,0000,0000,,Зараз вони мають \Nтрохи простіший вигляд. Dialogue: 0,0:00:47.29,0:00:52.18,Default,,0000,0000,0000,,Тепер я знову зміню "font-family",\Nвказавши шрифт "serif". Dialogue: 0,0:00:52.28,0:00:55.90,Default,,0000,0000,0000,,Ви побачили, що літери\Nвиглядають більш організовано? Dialogue: 0,0:00:55.90,0:00:59.86,Default,,0000,0000,0000,,Шрифт "serif" — це будь-який шрифт, який\Nмає маленькі "ніжки" на кінцях літер. Dialogue: 0,0:00:59.98,0:01:04.27,Default,,0000,0000,0000,,Коли ми кажемо браузеру використати шрифт\N"serif", він використає шрифт "serif", Dialogue: 0,0:01:04.27,0:01:07.55,Default,,0000,0000,0000,,який є за замовчуванням на цьому комп'ютері. \NПереважно це шрифт "Times New Roman". Dialogue: 0,0:01:07.55,0:01:10.55,Default,,0000,0000,0000,,Однак мені не дуже подобається,\Nцей шрифт, тому зараз Dialogue: 0,0:01:10.55,0:01:13.11,Default,,0000,0000,0000,,я поверну шрифт "sans-serif". Dialogue: 0,0:01:14.25,0:01:17.81,Default,,0000,0000,0000,,Слово "sans" походить з латинської мови\Nі означає "без". Dialogue: 0,0:01:17.100,0:01:21.81,Default,,0000,0000,0000,,Тому шрифт "sans-serif" — це той, який\Nне має "ніжок" на літерах. Dialogue: 0,0:01:22.10,0:01:23.72,Default,,0000,0000,0000,,Ось чому літери мають простіший вигляд. Dialogue: 0,0:01:24.18,0:01:27.94,Default,,0000,0000,0000,,Коли ми кажемо браузеру використати\Nшрифт "sans-serif", він використовує Dialogue: 0,0:01:27.94,0:01:33.14,Default,,0000,0000,0000,,шрифт "sans-serif", який є за замовчуванням,\Nі це переважно "Arial" або "Helvetica". Dialogue: 0,0:01:33.14,0:01:37.71,Default,,0000,0000,0000,,Але тут є важлива деталь: він вибере \Nшрифт, який встановлений Dialogue: 0,0:01:37.71,0:01:41.22,Default,,0000,0000,0000,,за замовчуванням на комп'ютері глядача,\Nа не автора. Dialogue: 0,0:01:41.55,0:01:45.26,Default,,0000,0000,0000,,Тому дуже ймовірно, що ми дивитимемось\Nна різні шрифти, якщо Dialogue: 0,0:01:45.32,0:01:47.60,Default,,0000,0000,0000,,ваш комп'ютер має інші значення\Nза замовчуванням, ніж мій. Dialogue: 0,0:01:47.60,0:01:52.53,Default,,0000,0000,0000,,Інколи мене це влаштовує, але бувають випадки,\Nколи мені дуже потрібно, щоб глядач Dialogue: 0,0:01:52.53,0:01:56.26,Default,,0000,0000,0000,,сторінки бачив її точно такою ж,\Nяк бачу її я. Dialogue: 0,0:01:56.70,0:02:01.98,Default,,0000,0000,0000,,В такому разі я можу визначити точне\Nім'я шрифту, наприклад, Helvetica. Dialogue: 0,0:02:03.15,0:02:07.94,Default,,0000,0000,0000,,Таке спрацює, якщо і ви, і я матимемо\Nшрифт Helvetica на наших комп'ютерах. Dialogue: 0,0:02:08.44,0:02:12.64,Default,,0000,0000,0000,,Але не всі комп'ютери мають однакові\Nшрифти, і в такому випадку комп'ютер Dialogue: 0,0:02:12.71,0:02:14.45,Default,,0000,0000,0000,,повністю проігнорує цю вказівку. Dialogue: 0,0:02:14.75,0:02:20.03,Default,,0000,0000,0000,,На щастя, CSS дозволяє нам визначити\Nальтернативний варіант шрифту, на випадок, Dialogue: 0,0:02:20.06,0:02:22.30,Default,,0000,0000,0000,,якщо певного шрифту не буде на комп'ютері. Dialogue: 0,0:02:22.98,0:02:28.00,Default,,0000,0000,0000,,Ви ставите кому після "Helvetica" і \Nпишете "sans-serif". Dialogue: 0,0:02:28.44,0:02:32.74,Default,,0000,0000,0000,,Тепер, якщо комп'ютер шукатиме шрифт\N"Helvetica" і не знайде його, Dialogue: 0,0:02:32.74,0:02:34.44,Default,,0000,0000,0000,,він використає шрифт "sans-serif"\Nза замовчуванням. Dialogue: 0,0:02:35.07,0:02:39.30,Default,,0000,0000,0000,,Загалом, щоразу, як ви визначатимете\Nконкретне ім'я шрифту, як Helvetica, Dialogue: 0,0:02:39.32,0:02:43.52,Default,,0000,0000,0000,,ви маєте також визначати\Nальтернативний варіант шрифту. Dialogue: 0,0:02:43.73,0:02:47.63,Default,,0000,0000,0000,,Окрім "serif" і "sans-serif" існує\Nдекілька інших стандартних Dialogue: 0,0:02:47.63,0:02:49.88,Default,,0000,0000,0000,,шрифтів, які ми можемо\Nвикористовувати. Dialogue: 0,0:02:50.10,0:02:55.27,Default,,0000,0000,0000,,Якщо ми хочемо, щоб слова були наче \Nнаписані від руки, ми обираємо Dialogue: 0,0:02:55.27,0:02:58.27,Default,,0000,0000,0000,,"font-family: cursive". Dialogue: 0,0:02:58.27,0:03:03.87,Default,,0000,0000,0000,,Якщо ми хочемо, щоб вони виглядали\Nвеселіше, ми можемо спробувати шрифт "fantasy". Dialogue: 0,0:03:04.94,0:03:08.30,Default,,0000,0000,0000,,А якщо ми хочемо, щоб вони були\Nначе надруковані на друкарській машинці, Dialogue: 0,0:03:08.30,0:03:11.12,Default,,0000,0000,0000,,ми можемо використати шрифт\N"monospace". Dialogue: 0,0:03:11.20,0:03:14.61,Default,,0000,0000,0000,,Цей шрифт має фіксовану ширину, що\Nозначає, що всі літери Dialogue: 0,0:03:14.61,0:03:16.31,Default,,0000,0000,0000,,будуть однакові по ширині. Dialogue: 0,0:03:16.48,0:03:20.05,Default,,0000,0000,0000,,І насправді, ви бачили багато шрифтів\N"monospace" тут, на сайті KhanAcademy, Dialogue: 0,0:03:20.26,0:03:23.33,Default,,0000,0000,0000,,тому що ми завжди використовуємо\Nтакі шрифти для редакторів коду. Dialogue: 0,0:03:23.100,0:03:27.08,Default,,0000,0000,0000,,Оскільки ми хочемо, щоб весь код\Nлежав на одній прямій, незалежно Dialogue: 0,0:03:27.22,0:03:28.51,Default,,0000,0000,0000,,від літер у слові. Dialogue: 0,0:03:29.48,0:03:33.31,Default,,0000,0000,0000,,Зараз, коли ви вже знаєте, як змінити\Nшрифти, з розумом використайте ці знання. Dialogue: 0,0:03:33.45,0:03:36.95,Default,,0000,0000,0000,,Якщо ви хочете, щоб ваша сторінка мала гарний\Nвигляд, обмежтесь кількома Dialogue: 0,0:03:36.95,0:03:40.73,Default,,0000,0000,0000,,шрифтами і виберіть ті, \Nякі добре виглядають разом. Dialogue: 0,0:03:40.73,0:03:43.60,Default,,0000,0000,0000,,Але... якщо ви не хочете, щоб ваша\Nсторінка мала гарний вигляд, Dialogue: 0,0:03:43.60,0:03:47.28,Default,,0000,0000,0000,,робіть все, що завгодно!\NРозпочинайте змінювати шрифти! Dialogue: 0,0:03:47.38,0:03:52.14,Default,,0000,0000,0000,,Переклад еа українську мову: Зоряна Гаврилюк, рев'юер: Юлія Білаш, Благодійний фонд "MagneticOne.org"