22Существует несколько способов задания CSS стилей в HTML документе:
- Встроенный CSS стиль. Внутри тэга
styleможно определить CSS стили, которые будут применяться только к этому конкретному элементу. Пример:
<!DOCTYPE html>
<html>
<head>
<title>Моя страница</title>
<style>
h1 {
color: red;
}
</style>
</head>
<body>
<h1>Заголовок</h1>
<p>Описание</p>
</body>
</html>Здесь мы определили, что стиль color: red; будет применяться к заголовку h1.
- Внешний CSS файл. CSS стили можно определить в отдельном файле с расширением .css, который затем подключается к HTML документу внутри тэга
head. Пример:
<!DOCTYPE html>
<html>
<head>
<title>Моя страница</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Заголовок</h1>
<p>Описание</p>
</body>
</html>Здесь мы подключили файл style.css, который содержит все CSS стили для данной страницы.
- Атрибут «style». Можно применить CSS стиль к элементу с помощью атрибута «style». Пример:
<!DOCTYPE html>
<html>
<head>
<title>Моя страница</title>
</head>
<body>
<h1 style="color: red;">Заголовок</h1>
<p>Описание</p>
</body>
</html>Здесь мы применили стиль color: red; к заголовку h1 с помощью атрибута «style». Обратите внимание, что это работает только для данного элемента и не может быть переиспользовано в других частях кода.
