- Css Code

Code description		.	Code description	.
Background image	<style type="text/css"> body {background-image: url(http://BLAH.GIF);} </style>		Upsidedown links	<style type="text/css"><!-- a:hover{filter:flipv(color:#FF9999, strength=3);height:0px;width:inherit} //--></style>
Fixed background image	<STYLE type=text/css><!-- body {background: url(http://www.your image url here) fixed; background-color: ffffff;} //--></STYLE>		Embossed links	<style type='text/css'> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;} </style>
Nontiling background image	<STYLE type=text/css> body { background-image: url(YOUR IMAGE); background-attachment: fixed; background-repeat: no-repeat; background-position: top center; } </STYLE>		Capitalize first letter in a paragraph	<style type="text/css"> <!-- .myparagraph:first-letter{ font-size:200%; float:left; color:blue; --> </style> Then use this code where ever you begin a new paragraph <p>. <p class="myparagraph">YOUR TEXT GOES HERE".</p>
Solid color background	<style type="text/css"> body { background: #FFFF00; } </style>		Link decoration overline	<STYLE type="text/css"><!-- A:link{color:#00FF66;text-decoration:underline;} A:visited{color:#00FF66;text-decoration:underline;} A:active{color:#00FF66;text-decoration:underline;} A:hover{color:#00FF66;text-decoration:none overline;} --></style>
Flip your page to the left side	<STYLE>body{direction:rtl;}</STYLE>		Fixed vertical text left side	<STYLE type=text/css> .vert { position:absolute; left:1px; top:50px; width:1px; writing-mode: tb-rl; } </STYLE> <SPAN class=vert><FONT color=#ff0000>YOUR MESSAGE HERE</FONT></SPAN>
Image links on mouseover	<STYLE type=text/css> a.navbar:hover{color:red; font-weight:bold;background-image:url(http://www.your image url here);} a:hover, a.redlink:hover, a.navbar:hover {background-image:url(http://www.your image url here); text-decoration:none; border:0px solid;} a:hover img {background-image:url(http://www.your image url here); filter:alpha(finishopacity=0, style=2); } </STYLE>		No underlined links	<style type="text/css"> <!-- A:link {text-decoration:none} A:visited {text-decoration:none} --> </style>
Blured links on mouseover	<style type="text/css"> a:hover img {filter: blur(add = 0, direction = 225, strength = 10)}</style>		Engrave links on mouseover	<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.engrave;} </style>
Blured links, normal mouseover	<style type="text/css"> a:link img {filter:blur(add = 0, direction = 225, strength = 10);}a:visited img {filter:blur(add = 0, direction = 225, strength = 10);}a:hover img {filter: none}</style>		Engrave with normal mouseover	<style type="text/css"> a:link img {filter:progid:dximagetransform.microsoft.engrave;} a:visited img {filter:progid:dximagetransform.microsoft.engrave;} a:hover img {filter:none;} </style>
Invert link color on mouseover	<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:invert;} </style>		Invert color with normal mouseover	<style type="text/css"> a:link img {filter:invert;} a:visited img {filter:invert;} a:hover img {filter:none;} </style>
X ray mouseover links	<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:xray();} </style>		X-ray with Normal Mouseover	<style type="text/css"> a:link img {filter:xray();} a:visited img {filter:xray();} a:hover img {filter:none;} </style>
Transparent links on mouseover	<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:alpha(opacity=60);} </style>		Transparent links with normal mouseover	<style type="text/css"> a:link img {filter:alpha(opacity=60);} a:visited img {filter:alpha(opacity=60);} a:hover img {filter:none;} </style>
Transforming links with color change	<style type="text/css" > A:hover { color:red; font-size:10pt; font-family: Verdana, Times New Roman, Helvetica, sans-serif; font-style:italic; font-weight:bold; text-decoration:underline; cursor:hand; font-variant:small-caps; text-transform:uppercase; background-color:white; } </style>		Custom cursor