Как поместить css в html

Существует несколько способов поместить CSS в HTML:

Встроенный CSS: CSS-код помещается в тегstyle> внутри :

<!DOCTYPE html>
<html>
<head>
    <title>Моя страница</title>
    <style>
        body {
            background-color: #f2f2f2;
            font-family: Arial, sans-serif;
        }
        h1 {
            color: #333;
            font-size: 32px;
        }
    </style>
</head>
<body>
    <h1>Привет, мир!</h1>
    <p>Это моя первая веб-страница.</p>
</body>
</html>

Внешний CSS: CSS-код хранится в отдельном файле с расширением .css, который подключается к HTML-странице с помощью тега :

<!DOCTYPE html>
<html>
<head>
    <title>Моя страница</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <h1>Привет, мир!</h1>
    <p>Это моя первая веб-страница.</p>
</body>
</html>

Встроенный CSS в элементы: CSS-код можно также поместить непосредственно в атрибуты элементов:

<!DOCTYPE html>
<html>
<head>
    <title>Моя страница</title>
</head>
<body>
    <h1 style="color: #333; font-size: 32px;">Привет, мир!</h1>
    <p style="background-color: #f2ff2; font-family: Arial, sans-serif;">Это моя первая веб-страница.</p>
</body>
</html>