Home > DeveloperSection > Articles > CSS Background-Attachment

CSS Background-Attachment


CSS-CSS3 CSS-CSS3 
Ratings:
0 Comment(s)
 2553  View(s)
Rate this:

CSS Background-Attachment

In this article I am trying to explain how to set a background-attachment.

If you want to fix an image as a application background then we can use background-attachment property to complete this task.

background-attachment has three values:-

1.       Fixed - This value will set background image is fixed.

2.       Scroll – This is default, this value will background image scrolls with the rest of the page.

3.       Inherit – This value is inheriting the parent elements.

<!DOCTYPE html>

<html>

<head>

<style>

body

{

width:150px;

height:100px;

background-image:url('images.jpg');

background-repeat:no-repeat;

background-attachment:fixed;

background-position:left;

 

margin-left:150px;

 

}

</style>

</head>

 

<body>

<div>

 MindStick is Microsoft ISV Gold certified software development company specializing in product development,

programming and consulting services.

 

Currently we have three software products named MindStick Cleaner and MindStick Data Converter, MindStick

urvey Manager which are available free of cost. Our extensive experience with enterprise software development in

web, desktop and mobile has been a key to our customer’s success. Our global customers have successfully

partnered with us in designing, developing and testing complex software products based on Microsoft’s latest

technologies.

MindStick also serves to developer and student communities by providing guidance and help via its development

portal articles, blogs, and user groups, quiz and interview sections. We are proud to partner with small, medium and

enterprise size businesses worldwide. </div>

</body>

</html>

Output:

 

CSS Background-Attachment


Don't want to miss updates? Please click the below button!

Follow MindStick