Background Color
<!-- Codes by Quackit.com -->
<div style="background-color:yellow;width:200px;">
<p>HTML background code is limited, CSS background code is much better!</p>
</div>
<p><a href="
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] color</a></p>
---------------------------------------------------------------------------------------
Background Image
<div style="background-image:url(/pix/smile.gif);
background-repeat:repeat;
background-attachment:fixed;
overflow:scroll;
width:200px;
height:100px;">
<p>HTML background code is limited, CSS background code is much better!
example shows how a background image can be set to a fixed position
- even though its containing block scrolls.</p>
</div>
<p><a style="font-size:10px;" href="
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] Backgrounds</a></p>
---------------------------------------------------------------------------
Shorthand Background Code
<div style="background:url(/pix/smile.gif) repeat fixed;
overflow:scroll;
width:200px;
height:100px;">
<p>HTML background code is limited, CSS background code is much better!
example shows how a background image can be set to a fixed position
- even though its containing block scrolls.</p>
</div>
<p><a style="font-size:10px;" href="
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] Patterns</a></p>
------------------------------------------------------------------------------
Backgrounds for the Whole Page
<html>
<head>
</head>
<
body style="background-color:#eeeeee;">
...content goes here...
</body>
------------------------------------------------------------------------------
HTML Stretch Background Image
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]">
<html>
<head>
<title>Stretched Background Image</title>
<style type="text/css">
/* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */
html, body {height:100%; margin:0; padding:0;}
/* Set the position and dimensions of the background image. */
#page-background {position:fixed; top:0; left:0; width:100%; height:100%;}
/* Specify the position and layering for the content that needs to appear in front of the background image. Must have a higher z-index value than the background image. Also add some padding to compensate for removing the margin from the 'html' and 'body' tags. */
#content {position:relative; z-index:1; padding:10px;}
</style>
<!-- The above code doesn't work in Internet Explorer 6. To address this, we use a conditional comment to specify an alternative style sheet for IE 6 -->
<!--[if IE 6]>
<style type="text/css">
html {overflow-y:hidden;}
body {overflow-y:auto;}
#page-background {position:absolute; z-index:-1;}
#content {position:static;padding:10px;}
</style>
<![endif]-->
</head>
<body>
<div id="page-background"><img src="
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]" width="100%" height="100%" alt="Smile"></div>
<div id="content">
<h2>Stretch that Background Image!</h2>
<p>This text appears in front of the background image. This is because we've used CSS to layer the content in front of the background image. The background image will stretch to fit your browser window. You can see the image grow and shrink as you resize your browser.</p>
<p>Go on, try it - resize your browser!</p>
</div>
</body>
</html>
-----------------------------------------------------------------------------------------
Background Music Code
<embed name="lostmojo"
src="/web_design/lostmojo.wav"
loop="false"
hidden="true"autostart="true">
</embed>
add
<embed name="lostmojo"
src="/web_design/lostmojo.wav"
loop="false"
width="300"
height="90"
hidden="false"
autostart="false">
</embed>
------------------------------------------------------------------------
HTML Fixed Background
<div style="background-image:url(/pix/smile.gif);
background-repeat:repeat;
background-attachment:fixed; overflow:scroll;
width:200px;
height:100px;">
</div>
--------------------------------------------
Shorthand Code
<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>