Існує 3 способи, як здійснити підключення CSS стилів для вашого сайту: ви можете використовувати глобальні стилі CSS, додавши CSS правила в контейнер
HTML документа, ви можете додати посилання на зовнішній .css файл, який містить всі необхідні правила або використовувати внутрішній CSS для застосування правил до певного елементу. У цьому керівництві ми розглянемо всі три варіанти підключення CSS, дізнаємося їхні переваги і недоліки.Варіант 1 - Глобальний CSS
Глобальний CSS поміщається в контейнер
конкретної сторінки. При такому варіанті підключення класи і ідентифікатори (ID) можуть бути використані для звернення до CSS коду, проте, вони будуть активні тільки на цій конкретній сторінці. CSS стилі підключені таким шляхом завантажуються при кожній повторному завантаженні сторінки, тому вони можуть вплинути на швидкість її завантаження. Проте, існує кілька ситуацій в яких використання глобальних CSS може бути корисно. Наприклад, якщо вам необхідно відправити кому-небудь шаблон сторінки - вам набагато простіше буде надати попередній результат, якщо все буде на одній сторінці. Глобальні CSS поміщаються між тегами . Ось приклад глобальної таблиці стилів:- Таблиця стилів впливає тільки на одну сторінку.
- У глобальній CSS можуть бути використані класи і ідентифікатори (ID).
- Немає необхідності завантажувати декілька файлів. HTML і CSS можуть бути в одному і тому ж файлі.
Недоліки глобальних CSS:
- Збільшений час завантаження сторінки.
- Підключається тільки до однієї сторінки - неефективно, якщо ви хочете використовувати одну і ту ж CSS для декількох сторінок.