Background Properties

Developer
Fezzik
Size
2,672 Kb
Views
12,144
  1. Background Properties Previews
  2. Background Properties HTML Codes
  3. Background Properties CSS Codes

How do I make an background properties?

Background-attachment: [scroll, fixed, or local]background: [color] [image] [repeat] [attachment] [position-x] [position-y]. What is a background properties? How do you make a background properties? This script and codes were developed by Fezzik on 25 November 2022, Friday.

Background Properties Previews
IQ Test

Background Properties - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Background Properties</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<!DOCTYPE html>
<html>
<head>	<title>Background Properties</title>	<link rel="stylesheet" href="style.css">	<link rel="stylesheet" href="page-styles.css">
</head>
<body>	<div class="scroll attch">	<h2>Scroll</h2>	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et nibh nunc, quis imperdiet elit. Aenean mattis nisl sit amet ipsum pulvinar sit amet lobortis purus consequat. Donec urna ligula, aliquet vitae tempor sit amet, rutrum vel erat. Maecenas vitae feugiat est. Nulla facilisi. Duis mattis elementum dignissim. Nunc vulputate euismod fringilla.</p>	<p>Vestibulum enim urna, tempor vel dignissim vel, ultricies at turpis. Donec vulputate metus ut libero tincidunt vel egestas quam malesuada. Morbi ut libero est, eget placerat elit. Nunc molestie blandit est id hendrerit. Aliquam erat volutpat. Suspendisse ultricies aliquet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>	<p>Vestibulum ut venenatis nibh. Aenean vestibulum sagittis odio, eget commodo urna posuere mattis. Quisque scelerisque porttitor dolor, id suscipit augue aliquet et. Proin facilisis mauris nec leo tincidunt varius. Fusce quis scelerisque arcu. Curabitur eu nisl magna, et bibendum arcu. Donec justo erat, venenatis eget sodales a, rhoncus et ante. Sed nec turpis vitae augue lobortis viverra.</p>	<p>Aenean semper rutrum vestibulum. Ut rutrum tortor nec neque sodales sit amet porta velit imperdiet. Ut lobortis metus ut diam sagittis id facilisis mauris faucibus. Curabitur mattis ante quis lectus laoreet vitae accumsan nibh pulvinar. Vivamus a consectetur neque. Quisque felis risus, tincidunt et luctus eu, pulvinar vitae neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>	</div>	<div class="fixed attch">	<h2>Fixed</h2>	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et nibh nunc, quis imperdiet elit. Aenean mattis nisl sit amet ipsum pulvinar sit amet lobortis purus consequat. Donec urna ligula, aliquet vitae tempor sit amet, rutrum vel erat. Maecenas vitae feugiat est. Nulla facilisi. Duis mattis elementum dignissim. Nunc vulputate euismod fringilla.</p>	<p>Vestibulum enim urna, tempor vel dignissim vel, ultricies at turpis. Donec vulputate metus ut libero tincidunt vel egestas quam malesuada. Morbi ut libero est, eget placerat elit. Nunc molestie blandit est id hendrerit. Aliquam erat volutpat. Suspendisse ultricies aliquet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>	<p>Vestibulum ut venenatis nibh. Aenean vestibulum sagittis odio, eget commodo urna posuere mattis. Quisque scelerisque porttitor dolor, id suscipit augue aliquet et. Proin facilisis mauris nec leo tincidunt varius. Fusce quis scelerisque arcu. Curabitur eu nisl magna, et bibendum arcu. Donec justo erat, venenatis eget sodales a, rhoncus et ante. Sed nec turpis vitae augue lobortis viverra.</p>	<p>Aenean semper rutrum vestibulum. Ut rutrum tortor nec neque sodales sit amet porta velit imperdiet. Ut lobortis metus ut diam sagittis id facilisis mauris faucibus. Curabitur mattis ante quis lectus laoreet vitae accumsan nibh pulvinar. Vivamus a consectetur neque. Quisque felis risus, tincidunt et luctus eu, pulvinar vitae neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>	</div>	<div class="local attch">	<h2>Local</h2>	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et nibh nunc, quis imperdiet elit. Aenean mattis nisl sit amet ipsum pulvinar sit amet lobortis purus consequat. Donec urna ligula, aliquet vitae tempor sit amet, rutrum vel erat. Maecenas vitae feugiat est. Nulla facilisi. Duis mattis elementum dignissim. Nunc vulputate euismod fringilla.</p>	<p>Vestibulum enim urna, tempor vel dignissim vel, ultricies at turpis. Donec vulputate metus ut libero tincidunt vel egestas quam malesuada. Morbi ut libero est, eget placerat elit. Nunc molestie blandit est id hendrerit. Aliquam erat volutpat. Suspendisse ultricies aliquet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>	<p>Vestibulum ut venenatis nibh. Aenean vestibulum sagittis odio, eget commodo urna posuere mattis. Quisque scelerisque porttitor dolor, id suscipit augue aliquet et. Proin facilisis mauris nec leo tincidunt varius. Fusce quis scelerisque arcu. Curabitur eu nisl magna, et bibendum arcu. Donec justo erat, venenatis eget sodales a, rhoncus et ante. Sed nec turpis vitae augue lobortis viverra.</p>	<p>Aenean semper rutrum vestibulum. Ut rutrum tortor nec neque sodales sit amet porta velit imperdiet. Ut lobortis metus ut diam sagittis id facilisis mauris faucibus. Curabitur mattis ante quis lectus laoreet vitae accumsan nibh pulvinar. Vivamus a consectetur neque. Quisque felis risus, tincidunt et luctus eu, pulvinar vitae neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>	</div>
</body>
</html>
</body>
</html>

Background Properties - Script Codes CSS Codes

body {	padding-bottom: 100px;	background: #2A2A2A;	color: #FFF;	text-shadow: 0 1px #000;	font: 1.1em/1.5 sans-serif;
}
h2 {	margin: 0;	font-size: 2em;
}
.box, .attch {	box-sizing: border-box;	margin: 40px auto;	padding: 20px;	width: 800px;	height: 500px;
}
.scroll, .fixed, .local {	overflow: auto;	height: 400px;	background-image: url('https://24.media.tumblr.com/e7652f208e0108acf9a0edda7ced2035/tumblr_n3vv0xw1hZ1sfie3io1_1280.jpg'); background-color: steelblue; background-repeat: no-repeat; /* background: steelblue url('https://24.media.tumblr.com/e7652f208e0108acf9a0edda7ced2035/tumblr_n3vv0xw1hZ1sfie3io1_1280.jpg') no-repeat center center; */
}
.fixed { background-attachment: fixed; /* Image is fixed to the viewport */
}
.local { background-attachment: local; /* Image is fixed to the element and its content. NOTE: 'local' is not supported by Firefox! */
}
Background Properties - Script Codes
Background Properties - Script Codes
Home Page Home
Developer Fezzik
Username Fezzik
Uploaded November 25, 2022
Rating 3
Size 2,672 Kb
Views 12,144
Do you need developer help for Background Properties?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Fezzik (Fezzik) Script Codes
Name
Print Stylesheets
Transitions - Part 2
Device-Specific Media Queries - Part 1
Text Properties
3D Transforms - Part 1
3D Transforms - Part 2
List Properties
Web Fonts
Full-page Animation Project - Page 2
Additional Pseudo-Classes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!