Фон CSS
Свойство CSS background обеспечивает стилизацию фона элементов HTML. Некоторые свойства:
- background-color - цвет фона
- background-imge - картинка фона
- backround-repeat - повторение фона
- background-attachment - прокрутка фона вместе с содержимым
- background-position - расположение фона
Цвет фона
background-color
Свойство задает цвет фона элемента.
Пример
<!DOCTYPE html>
<html lang="en">
<head>
<title> CSS Background </title>
<meta charset="UTF-8">
<style>
body {
background-color: pink;
}
</style>
</head>
<body>
<h1>Hello World!</h1>
<p>This page has a pink background color!</p>
</body>
</html>Выход
Привет, мир!
Эта страница имеет розовый цвет фона!
Пример
<!DOCTYPE html>
<html lang="en">
<head>
<title> CSS Background Color </title>
<meta charset="UTF-8">
<style>
h1 {
background-color: seagreen;
padding:10px;
}
p {
background-color: lightblue;
padding:10px;
}
</style>
</head>
<body>
<h1> CSS background-color example!</h1>
<p> This paragraph has its own background lightblue color.</p>
</body>
</html>Выход
Пример цвета фона CSS!
Этот абзац имеет свой фон светло-голубого цвета.
Фоновая картинка
background-image
Свойство устанавливает изображение в качестве фона элемента.
Пример
<!DOCTYPE html>
<html lang="en">
<head>
<title> CSS Background Image </title>
<meta charset="UTF-8">
<style>
body {
background-image: url("image.png");
}
</style>
</head>
<body>
<h1> CSS background-image example! </h1>
<p> This is an example of Background Image. </p>
</body>
</html>