CSS (Cascading Style Sheets) — это язык стилей, который используется для определения внешнего вида HTML-документов. CSS применяется к HTML-элементам с помощью селекторов, зависимостей, определенных в CSS.
Следуя принципу «разделяй и властвуй», CSS-стили хранятся в отдельных файлах, которые затем подключаются к HTML-странице. Для того чтобы применить CSS-стили к HTML-документу, необходимо выполнить следующие шаги:
- Создайте файл CSS и определите нужные стили.
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
font-size: 16px;
color: #333;
}
h1 {
font-size: 24px;
color: #006699;
}
a {
color: #006699;
text-decoration: none;
}
- Создайте HTML-документ и подключите файл CSS.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Пример страницы</h1>
<p>Это пример содержимого страницы.</p>
<ul>
<li><a href="#">Ссылка 1</a></li>
<li><a href="#">Ссылка 2</a></li>
<li><a href="#">Ссылка 3</a></li>
</ul>
</body>
</html>
В этом примере мы создали HTML-документ, включив тег <link> в раздел <head>, который указывает на путь к файлу CSS. В файле CSS мы определили стили для элементов body, h1 и a.
После того, как HTML-документ и файл CSS созданы и связаны между собой, стили из файла CSS будут автоматически применяться к соответствующим элементам на странице. В нашем примере, элементы h1 и a примут стили, определенные в файле CSS.
CSS позволяет создавать красивые, современные и адаптивные макеты для сайтов. Он позволяет изменять каждый аспект внешнего вида HTML-страниц, от шрифтов и цветов до расположения и размеров элементов.