16HTML и CSS могут быть объединены на несколько способов:
- Внутренний CSS
Внутренний CSS позволяет вставить стили непосредственно в HTML-код, используя тег <style>. Вот пример:
<!DOCTYPE html>
<html>
<head>
<title>Пример внутреннего CSS</title>
<style>
body {
background-color: #f0f0f0;
}
h1 {
color: #333;
font-size: 32px;
text-align: center;
}
</style>
</head>
<body>
<h1>Привет, мир!</h1>
</body>
</html>- Внешний CSS
Внешний CSS позволяет создать отдельный файл со стилями и подключить его к HTML-странице с помощью тега <link>. Вот пример:
HTML-код:
<!DOCTYPE html>
<html>
<head>
<title>Пример внешнего CSS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Привет, мир!</h1>
</body>
</html>CSS-код в файле «style.css»:
body {
background-color: #f0f0f0;
}
h1 {
color: #333;
font-size: 32px;
text-align: center;
}- Инлайновый CSS
Инлайновый CSS позволяет установить стили непосредственно в атрибут «style» HTML-элемента. Вот пример:
<!DOCTYPE html>
<html>
<head>
<title>Пример инлайнового CSS</title>
</head>
<body>
<h1 style="color: #333; font-size: 32px; text-align: center;">Привет, мир!</h1>
</body>
</html>Также возможно использовать смешанный вариант, когда один файл CSS содержит и внешние, и внутренние стили, которые подключаются через тег <link> и тег <style> соответственно.
Таким образом, есть несколько способов объединения HTML и CSS, и выбор зависит от особенностей проекта и личных предпочтений.
