CSS можна додати до HTML трьома різними способами. Щоб оформити один елемент HTML на сторінці, використовувати вбудований CSS в атрибуті style. Додавши CSS до головного розділу нашого HTML-документа, ми можемо вбудувати внутрішню таблицю стилів. Ми також можемо підключитися до зовнішньої таблиці стилів, яка відокремлює наш CSS від нашого HTML.

CSS3, також відомий як Каскадні таблиці стилів, рівень 3, є вдосконаленою версією CSS і наступником CSS2. CSS3 використовується для того ж, що й CSS, а саме для оформлення веб-сторінок і надання їм більшої привабливості та зручності для користувача.

Щоб пов’язати CSS із файлом HTML, ми використовуйте тег <link> у розділі HTML <head>. Ваш файл CSS виглядатиме так, як показано нижче: Давайте розглянемо інший приклад, коли ви додаєте зображення за допомогою CSS. Примітка. Переконайтеся, що файл зображення знаходиться в тій же папці, що й файли CSS і HTML.

Призначте клас CSS елементам, додавши атрибут class. Створіть таблицю стилів CSS у тій же папці та зв’яжіть їх. Виберіть клас за допомогою символу крапки, а потім його імені та властивостей стилю. Застосуйте додаткові класи до свого HTML, щоб зберегти узгодженість дизайну.

Кожна HTML-сторінка має містити посилання на зовнішній файл таблиці стилів всередині елемента <link> у розділі head.

  1. <! DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" href="styles.css">
  5. </head>
  6. <body>
  7. <!– Your HTML content goes here –>
  8. </body>