НАЙКРАЩИЙ САЙТ ДЛЯ ВЕБ-РОЗРОБНИКІВ

CSS Підручник

CSS СТАРТ CSS Інтро CSS Синтаксис CSS Селектори CSS Як підключити CSS Коментарі CSS Кольори CSS Фони CSS Межі CSS Поля CSS Внутрішній відступ CSS Висота/Ширина CSS Блочна модель CSS Контур CSS Текст CSS Шрифти CSS Іконки CSS Посилання CSS Списки CSS Таблиці CSS Display CSS Max-Width CSS Position CSS Z-index CSS Overflow CSS Float CSS Inline-Block CSS Вирівнювання CSS Комбінатори CSS Псевдо-класи CSS Псевдо-елементи CSS Непрозорість CSS Панель навігації CSS Випадаючі списки CSS Галерея зображень CSS Спрайти зображень CSS Селектори атрибутів CSS Форми CSS Лічильники CSS Макет веб-сайту CSS Одиниці CSS Специфічності

CSS Продвинутий

CSS Закруглені кути CSS Межі зображень CSS Фони CSS Кольори CSS Градієнти CSS Тіні CSS Ефекти тексту CSS Веб-шрифти CSS 2D Трансформації CSS 3D Трансформації CSS Переходи CSS Анімації CSS Підказки CSS Стилі зображень CSS Підгонка об'єкту CSS Кнопки CSS Нумерація сторінок CSS Кілька стовпців CSS Користувальницький інтерфейс CSS Змінні CSS Розміри блоків CSS Медіа-запити CSS Приклади медіа-запитів CSS Flexbox

CSS Адаптивний

RWD Інтро RWD Область перегляду RWD Вигляд сітки RWD Медіа-запити RWD Зображення RWD Відео RWD Фреймворки RWD Шаблони

CSS Grid (Сітка)

Grid Інтро Grid Контейнер Grid Елементи

CSS Приклади

CSS Шаблони CSS Приклади CSS Вікторина CSS Вправи CSS Сертифікат

CSS Довідники

CSS Довідник CSS Селектори CSS Функції CSS Довідник аудіо CSS Безпечні веб-шрифти CSS Анімація CSS Одиниці CSS PX-EM Конвертер CSS Кольори CSS Значення кольору CSS Значення за замовчуванням CSS Підтримка браузерами

Place for your advertisement!
CSS3. Уроки W3Schools для початківців українською мовою

En

CSS Інтро


Що таке CSS?

  • CSS розшифровується як Cascading Style Sheets (каскадні таблиці стилів)
  • CSS описує як HTML елементи мають відображатись на екрані, папері або інших носіях
  • CSS економлять багато часу. Вони можуть контролювати макет кількох вебсторінок одночасно
  • Зовнішні таблиці стилів зберігаються в окремих CSS файлах

CSS демо - Одна HTML сторінка - кілька стилів!

Тут ми покажемо одну HTML-сторінку з чотирма різними таблицями стилів. Натисніть на посилання "Таблиця стилів 1", "Таблиця стилів 2", "Таблиця стилів 3", "Таблиця стилів 4 нижче, щоб побачити різні стилі:


Навіщо використовувати CSS?

CSS використовується для визначення стилів ваших вебсторінок, включаючи дизайн, макет та варіанти відображення для різних пристроїв та розмірів екрану.


CSS вирішив велику проблему

HTML НІКОЛИ не повинен містити теги для форматування вебсторінки!

HTML був створений для опису змісту вебсторінки, наприклад:

<h1>Це заголовок</h1>

<p>Це параграф.</p>

Коли такі теги, як <font> та атрибути кольору були додані в специфікацію HTML 3.2, це стало жахіттям для веб-розробників. Розробка крупних вебсайтів, на яких шрифти та інформація про колір додавались на кожну сторінку, стала довготривалим та дуже вартісним процесом.

Щоб вирішити цю проблему, Консорціум World Wide Web (W3C) створив CSS.

CSS видалив форматування стилів із HTML-сторінок!

Якщо ви ще не знаєте, що таке HTML, рекомендуємо вам вивчити HTML Підручник на нашому сайті W3Schools українською.


CSS економить багато роботи!

Описи стилю зазвичай зберігаються у зовнішніх файлах з розширенням .css.

За допомогою зовнішнього файлу таблиці стилів ви можете змінити зовнішній вигляд всього сайту, змінивши лише один файл css!


Примітка. Варто зазначити, що більшість сучасних веббраузерів продовжують підтримувати старі вебсайти, які були зроблені згідно специфікацій HTML3.2 та HTML4, де використовувались теги форматування безпосередньо в файлах HTML, та відображають їх досить правильно. Але при створенні сучасних вебсайтів РЕКОМЕНДУЄТЬСЯ використовувати форматування лише в окремих CSS-файлах, які підключаються до файлів HTML!


Place for your advertisement!