Example of CSS background-attachment Property with fixed value

Source Code: (back to article)

<!DOCTYPE html>
<html>
 <head>
 <title>The title of the document</title>
 <style>
 body {
 background-image: url("/build/images/w3docs-logo-black.png");
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-size: 400px 100px;
 }
 </style>
 </head>
 <body>
 <h2>Background-attachment example</h2>
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 The background-image is fixed. Try to scroll down the page.
 If you do not see any scrollbars, try to resize the browser window.
 </body>
</html>