Set background-attachment to fixed : background attachment « CSS « HTML / CSS






  1. HTML / CSS
  2. CSS
  3. background attachment

Set background-attachment to fixed

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title></title>
<style type="text/css">

h1, h2, h3 {
 font-size: 200%;
 background-image: url(bkgd2.jpg);
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-position: center;
 padding: 1.5em;
 text-align: center;
 color: white;
}

</style>
</head>

<body>
  <h1>header 1</h1>

  <p>This is a text. This is a text. This is a text. This is a text.
  This is a text. This is a text. This is a text. This is a text.
  This is a text. This is a text. This is a text. This is a text.
  This is a text. This is a text. This is a text. This is a text.
  This is a text. This is a text. This is a text. This is a text.
  This is a text. This is a text. This is a text. This is a text.</p>
</body>
</html>








Related examples in the same category

1.'background-attachment' Example
2.Use background-attachment:scroll to scroll a background image when the user scrolls the content. This is the default value.
3.Use background-attachment:fixed to prevent the image from scrolling.
4.background-attachment: fixed;background-position: center;
5.background-attachment: fixed;
6.background-attachment: scroll