Background Cover
Background cover is a design that ensures an image spans the entire background of a webpage or element, adapting to different screen sizes for a visually consistent look. Also, to make sure the entire element is always covered, set the background-attachment property to fixed:
Syntax:
background-size: cover;
background-attachment:fixed;
Example: Implementation of background-size property.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Background Image</title>
</head>
<body background=
"https://media.w3wiki.org/wp-content/cdn-uploads/20210203170945/HTML-Tutorials.png"
style="background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;">
<h1 style="color: green;
text-align: center;">
Welcome to w3wiki
</h1>
</body>
</html>
Output:
HTML Background Images Example Output
HTML Background Images
HTML background images are graphics applied to the background of HTML elements, often used in webpage design for aesthetic or branding purposes. They’re set using CSS background-image property, allowing for single or repeating images, gradients, or patterns to enhance visual appeal.
Contact Us