Backgrounds
The CSS background properties are used to define the background effects for elements.
CSS background properties:
- background-color
- background-image
- background-repeat
- background-position
1.Background-color: The <background-color> property specifies the background color of an element.
<!DOCTYPE html>
<html>
<style>
body {background-color: }
</style>
<body>
<p>Hello, World!</p>
</body>
</html>
-
Background color can also be in <p>(paragraphs), <h1>(headings) and <div>(divs).
-
Background image: The <background-image> property specifies an image to use as the background of an element.
<!DOCTYPE html>
Hello, World!
-
Background image repeat: the <background-image> property repeats an image both horizontally and vertically.
<!DOCTYPE html>
Hello, World!
*Tip: To repeat an image vertically, set background-repeat: repeat-y;.
To only show the image once, set background-repeat: no-repeat;.
If you want your background image to cover the whole page, set background-size: cover;.
-
Background image position:The position of the image is specified by the <background-position> property.
<!DOCTYPE html>
Hello, World!
Exercise
Sponsors
