Quackit Logo

HTML

HTML Tutorial
HTML Codes/Generators
HTML Background Code
HTML Color
HTML Color Chart
HTML Comment Box Code
HTML Scrollbox Code
HTML Text Code
HTML Image Code
HTML Marquee Code
HTML Music Code
HTML Video Code
HTML Form Code
HTML Frames Code
HTML Entities
HTML Examples
HTML Help/Cheat Sheet
HTML Templates
More Codes...
HTML Generator
HTML Table Generator
Marquee Generator
Music Code Generator
HTML Text Generator
Text Box Generator
MySpace Generators
More Generators...
HTML Tags
HTML 5 Tags
Create a Website
FREE Hosting!
With every domain you register with ZappyHost you get FREE hosting.
Create free Flash websites

HTML Fixed Background

Print Version

This article provides HTML fixed background code - code for fixing the background image of an HTML element so that it doesn't scroll when its containing block scrolls.

To fix the position of a background image, use the CSS background-attachment property.

Example code:

<div style="background-image:url(/pix/smile.gif);
		background-repeat:repeat;
		background-attachment:fixed;
		overflow:scroll;
		width:200px;
		height:100px;">
</div>

This results in:

HTML fixed background code is generated by applying the CSS background-attachment property against an HTML element. When the box scrolls, the background image stays fixed in the same position.

Shorthand Code

You can use the CSS background tag to set all the background properties at once. Therefore, using the previous code example, we could rewrite it to this:

<div style="background:url(/pix/smile.gif) repeat fixed;
		overflow:scroll;
		width:200px;
		height:100px;">
HTML fixed background code is generated by applying the
CSS background-attachment property against an HTML element.
When the box scrolls, the background image stays fixed
in the same position.
</div>
HTML fixed background code is generated by applying the CSS background-attachment property against an HTML element. When the box scrolls, the background image stays fixed in the same position.

Enjoy this website?

  1. Add this page to your Favorites
  2. Link to this page (copy/paste into your own website or blog):
  3. Help support Quackit by making a donation

Oh, and thank you for supporting Quackit!
Need Website Content?
Get unique, quality digital content for your website.
  • 270+ Website Templates
  • 800+ Flash Templates
  • 25,000+ Images, Logos
  • 30,000+ e-Books
  • 15,000+ Scripts
  • 27,000+ Animated GIFs
  • 21,000+ Ringtones
  • ...and much more!
Get your content now!
$1.99 .info domain names!
© Copyright 2000 - 2010 Quackit.com