CSS - background-attachment


Description

background-attachment determines the tiling context and scroll state of a background image.

Possible Values

  • scroll − A background image set to scroll will scroll along with the rest of the document.

  • fixed − A background image set to fixed will remain locked in place while the rest of the document scrolls.

Applies to

All the HTML elements.

DOM Syntax

object.style.backgroundAttachment = scroll | fixed;

Example

<html>
   <head>
   </head>
   
   <body>
      <p style = "background-image:url(/images/logo.png);  
         background-attachment:scroll;
         background-attachment:scroll;
         background-repeat: no-repeat;
         background-attachment: fixed;">
         
         This parapgraph has scrolling background image.
         This parapgraph has fixed repeated background image.
         This parapgraph has fixed repeated background image.
         This parapgraph has fixed repeated background image. 
         This parapgraph has fixed repeated background image.
         This parapgraph has fixed repeated background image.
      </p>
   
   </body>
</html> 

It will produce the following result −

Advertisements