Підключення CSS до HTML
Свайпніть щоб показати меню
Як підключити CSS до HTML
Існує три способи застосування CSS до HTML-документа:
- Вбудовані стилі;
- Вбудовані таблиці стилів;
- Зовнішні таблиці стилів.
Кожен метод працює по-різному та використовується у різних ситуаціях.
Вбудовані стилі
Вбудовані стилі записуються безпосередньо в HTML-елементі за допомогою атрибута style.
Приклад:
index.html
Цей стиль застосовується лише до цього конкретного елемента.
Вбудовані стилі зручні для швидкого використання, але вони не є багаторазовими та складні у керуванні у великих проєктах.
Вбудований стильовий аркуш
Вбудований стильовий аркуш записується всередині тегів <style> у секції <head> HTML-документа.
Приклад:
index.html
Цей метод застосовує стилі до всієї сторінки, але лише в межах одного HTML-файлу.
Корисно для невеликих або автономних сторінок.
Зовнішній файл стилів
Зовнішній CSS зберігає стилі в окремому файлі .css і підключає його до HTML за допомогою тегу <link>.
Приклад:
index.html
styles.css
Цей метод дозволяє повторно використовувати стилі на декількох сторінках.
Це рекомендований і найбільш масштабований підхід для реальних проєктів.
Inline styles: застосовуються безпосередньо до елементів, але не підлягають повторному використанню.
Embedded style sheet: розміщується всередині <head>, впливає лише на одну сторінку.
External style sheet: зберігається у окремому файлі .css, підлягає повторному використанню та рекомендований для більшості проєктів.
У цьому курсі ми переважно використовуватимемо зовнішні таблиці стилів.
Дякуємо за ваш відгук!
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат