1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
---
title: Getting started with CSS
slug: Web/Guide/CSS/Getting_started
translation_of: Learn/CSS/First_steps
translation_of_original: Web/Guide/CSS/Getting_started
---
<p><span class="seoSummary">Це керівництво ознайомить Вас з основними функціями та мовою (синтаксисом) каскадних таблиць стилів (<a href="/uk/docs/Web/Guide/CSS" title="/en-US/docs/Web/Guide/CSS"><strong>Cascading Style Sheets</strong></a> - CSS). Ви використовуєте CSS, щоб змінити зовнішній вигляд структурованого документу, такого як веб-сторінка. Урок також включає приклади вправ, які ви можете спробувати виконати на власному комп’ютері, щоб побачити ефекти CSS і функції, що реалізуються в сучасних браузерах.</span></p>
<p>Посібник призначений для початківців і будь-кого, хто б хотів повторити основи CSS. Якщо ви маєте більше досвіду з CSS, основна сторінка CSS містить <a href="/en-US/docs/Web/Guide/CSS" title="/en-US/docs/Web/Guide/CSS">списки</a> більш просуненого рівня.</p>
<nav class="fancyTOC"><a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/What_is_CSS" rel="next" title="Chapter 'What is CSS' of the CSS tutorial">що таке CSS</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Why_use_CSS" title="Chapter 'Why use CSS' of the CSS tutorial">Навіщо використовувати CSS</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/How_CSS_works" title="Chapter 'Як працює CSS' of the CSS tutorial">Як працює CSS</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance" title="Chapter 'Cascading and inheritance' of the CSS tutorial">каскадування та успадковування</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Selectors" title="Chapter 'Selectors' of the CSS tutorial">Селектори</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Readable_CSS" title="Chapter 'Readable_CSS' of the CSS tutorial">Читабельний CSS</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Text_styles" title="Chapter 'Text_styles' of the CSS tutorial">Текстові стилі</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Color" title="Chapter 'Color' of the CSS tutorial">Колір</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Content" title="Chapter 'Content' of the CSS tutorial">Контент</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Lists" title="Chapter 'Lists' of the CSS tutorial">Списки</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Boxes" title="Chapter 'Boxes' of the CSS tutorial">Boxes</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Layout" title="Chapter 'Layout' of the CSS tutorial">Layout</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Tables" title="Chapter 'Tables' of the CSS tutorial">Таблиці</a> <a class="button" href="/uk/docs/Web/Guide/CSS/Getting_Started/Media" title="Chapter 'Media' of the CSS tutorial">Медіа</a></nav>
<h2 id="Що_потрібно_для_початку_роботи">Що потрібно для початку роботи</h2>
<ul>
<li>Текстовий редактор</li>
<li>Сучасний браузер</li>
<li>Певний досвід роботи з текстовим редактором і браузером</li>
</ul>
<p>Не зважаючи на те, що вправи можуть допомогти тобі в навчанні, ти не зобов’язаний хз виконувати. Ти можеш просто читати керівництво та розглядати зображення.</p>
<p><strong>На замітку:</strong> Керівництво розглядає тему як CSS працює з кольором. Буде простіше завершити ці секції з кольоровим дисплеєм та нормальним кольоровим зором. </p>
<h2 id="Як_використовувати_це_керівництво">Як використовувати це керівництво</h2>
<p>В опрацюванні цього керівництва читай сторінки уважно і в визначеній послідовності. Якщо ти пропустиш сторінку, надалі може бути важко зрозуміти наступні сторінки підручника. </p>
<h3 id="Частина_І_основи_CSS">Частина І: основи CSS</h3>
<p>На кожній сторінці переглянь відділ <em>Інформація,</em> щоб зрозуміти як працює CSS. Спробуй секцію <em>Дія,</em> щоб випробувати CSS на власному комп’ютері.</p>
<p>To test your understanding, take the challenge at the end of each page. Solutions to the challenges are linked under the challenges, so you don't need to look at them if you don't want to.</p>
<p>Щоб глибше зрозуміти CSS, прочитай інформацію, яку ти знайдеш в блоці з заголовком <em>Детальніше</em>. Використай лінки у них, щоб знайти довідникову інформацію про CSS.</p>
<h3 id="Частина_II_Сфера_CSS">Частина II: Сфера CSS</h3>
<p>Друга частина підручника надає приклади, які показують сферу CSS з іншими веб- і Mozilla технологіями.</p>
<ol>
<li><a href="/uk/docs/Web/Guide/CSS/Getting_Started/JavaScript" title="en/CSS/Getting_Started/JavaScript">JavaScript</a></li>
<li><a href="/uk/docs/Web/Guide/CSS/Getting_Started/SVG_and_CSS" title="en/CSS/Getting_Started/SVG_graphics">SVG-графіка</a></li>
<li><a href="/uk/docs/Web/Guide/CSS/Getting_Started/XML_data" title="en/CSS/Getting_Started/XML_data">XML дані</a></li>
<li><a href="/uk/docs/Web/Guide/CSS/Getting_Started/XBL_bindings" title="en/CSS/Getting_Started/XBL_bindings">XBL сполучення</a></li>
<li><a href="/uk/docs/Web/Guide/CSS/Getting_Started/XUL_user_interfaces" title="en/CSS/Getting_Started/XUL_user_interfaces">Користувацбкі інтерфейси ХUL</a></li>
</ol>
|
