CSS можно написать непосредственно в теге <style></style> внутри элемента HTML-кода или использовать атрибут style у элементов.
Вот пример, как это сделать:
<!DOCTYPE html>
<html>
<head>
<title>Пример использования CSS в HTML</title>
</head>
<body>
<h1 style="color: red; background-color: yellow; border: 1px solid black;">Пример использования CSS в HTML</h1>
<p style="color: blue;">CSS можно использовать и напрямую в тегах</p>
<style>
h2 {
font-size: 24px;
color: green;
border: 2px dotted purple;
padding: 10px;
background-color: lightgrey;
}
p {
font-size: 14px;
color: maroon;
margin-left: 20px;
}
</style>
<h2>Заголовок с CSS, написанным внутри тега <style></style></h2>
<p>Этот текст написан с использованием CSS, написанного внутри тега <style></style></p>
</body>
</html>Здесь мы используем стили в двух местах. Стили внутри тега <style></style> делаются глобальными и будут применяться ко всем элементам на странице с указанным селектором. Стили в атрибуте style применяются к конкретному элементу.
Первый заголовок и первый абзац используют атрибут style для установки цвета текста, фона, границы и т.д. Второй заголовок и второй абзац используют стили, которые написаны в теге <style></style>. Стили для второго заголовка задают размер шрифта, цвет, границу, отступы и фон, а для второго абзаца только цвет текста и размер шрифта.
