Существует несколько способов поместить 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>