Простые способы связать файлы CSS с HTML: пошаговое руководство

Когда дело доходит до стилизации веб-страниц HTML, вам лучше всего использовать CSS (каскадные таблицы стилей). Связывая файлы CSS с вашими HTML-документами, вы можете отделить дизайн от контента, делая ваш код более чистым и удобным в обслуживании. В этой статье мы рассмотрим несколько простых способов связывания файлов CSS с HTML, а также примеры кода и понятные объяснения.

Метод 1: внешняя ссылка CSS
Наиболее распространенный и рекомендуемый способ связать файл CSS с HTML — использовать внешнюю ссылку CSS. Выполните следующие действия:

Шаг 1. Создайте файл CSS
Откройте текстовый редактор и создайте новый файл. Сохраните его с расширением.css, например «styles.css». Добавьте свой CSS-код в этот файл.

Шаг 2. Свяжите файл CSS в HTML
В HTML-файле в разделе вставьте следующую строку кода:

<link rel="stylesheet" href="styles.css">

Обязательно замените «styles.css» правильным путем к файлу CSS, если он находится в другом каталоге.

Метод 2: внутренний CSS
Если у вас небольшой HTML-документ и вы предпочитаете хранить все в одном файле, вы можете использовать внутренний CSS. Выполните следующие действия:

Шаг 1. Добавьте тег