Внешняя таблица стилей в HTML

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

В вопросе выше правильным ответом было следующее выражение: <link rel="stylesheet" type="text/css" href="mystyle.css">.

Ошибка других вариантов ответов заключается в неверном использовании тэгов и атрибутов. Давайте разберемся почему.

Почему этот ответ верный?

<link> является тегом HTML, который указывает браузеру на внешний ресурс, который должен быть связан с веб-страницей. В данном случае этот ресурс - CSS файл.

rel является атрибутом, который определяет отношение между этим внешним файлом стилей и HTML страницей. Значение 'stylesheet' указывает браузеру, что этот внешний файл является таблицей стилей.

type указывает тип контента внешнего ресурса. В данном случае это text/css, что обозначает стандартный CSS.

href обозначает путь к внешнему файлу. Это может быть относительный или абсолютный путь. В данном случае, mystyle.css располагается в той же директории, что и HTML-страница.

Пример

Предположим, у нас есть HTML-страница (index.html) и в той же директории лежит файл mystyle.css. Вот как будут выглядеть эти файлы:

index.html:

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
  <h1>Мой сайт</h1>
  <p>Привет, мир!</p>
</body>
</html>

mystyle.css:

body {
  background-color: lightblue;
}

h1 {
  color: navy;
}

p {
  color: red;
}

При открытии index.html в браузере заголовок будет отображаться цветом navy, а текст параграфа — красным, на голубом фоне.

Заключение

Внешние таблицы стилей - надежный и эффективный способ организации стилей вашего веб-сайта. Они помогают сделать ваш код более читаемым и упростить его обновление и поддержку.

Внешняя таблица стилей в HTML

Почему этот ответ верный?

Пример

Заключение

Related Questions