CSS Basics
As a general note with these codes unless you've got a vague idea of what you're doing
only edit the red stuff, that way you won't get burnt.
Instructions:
- For some of the less obvious things I've added possible changes in brackets:
For example:
font:FONT SIZE (8,10,12,14)pt verdana}
Would be used as:
font:12pt verdana}
- All code must be enclosed in style brackets,
For example:
<style type="text/css">
CSS CODE
</style>
Font
Font Colour: (shops)
<body text=COLOUR>
Font Colour & Size: (everywhere else)
<style type="text/css">
td,p,body{color:COLOUR;
font:FONT SIZE (8,10,12,14)pt verdana}
</style>
Glowing Text:
<style type="text/css">
td,p{filter:glow(color=COLOUR,strength=NUMBER (1,2,3))}
</style>
Links
Font and Links Colour & Size:
<style type="text/css">
a:link,a:visited{color:COLOUR;
font:FONT SZE (8,10,12,14)pt verdana}
a:active{color:COLOUR;
font:FONT SIZE (8,10,12,14)pt verdana}
</style>
Link Mouseover Background:
<style type="text/css">
a:hover{background:COLOUR}
</style>
Link Mouseover Border:
<style type="text/css">
a:hover{border:FONT SIZE (8,10,12,14)px dotted COLOUR}
</style>
Backgrounds
Add A Background Colour:
<style type="text/css">
body{background:COLOUR}</style>
Add a Background Image:
<style type="text/css">
body{background:url(URL);}</style>
Fixed Background:
<style type="text/css">
body{background:url(URL) fixed}</style>
Non-repeating Background:
<style type="text/css">
body{background:#ffffff url(URL) no-repeat}
</style>
Centered Background:
<style type="text/css">
body{background:#ffffff url(URL) no-repeat center}
</style>
Image Manipulation
Remove White Image Background:
<style type="text/css">
p img{filter:chroma(color=white)}
</style>
Faded Images:
<style type="text/css">
table{background:transparent}
img{filter:xray alpha(Opacity=NUMBER (1-100), FinishOpacity=1, Style=3, StartX=0, FinishX=80, StartY=0, FinishY=80)}
</style>
Other Stuff
Coloured Scrollbars:
<style type="text/css">
body {scrollbar-face-color:COLOUR; scrollbar-arrow-color:COLOUR; scrollbar-track-color:COLOUR; scrollbar-shadow-color:COLOUR; scrollbar-highlight-color:COLOUR; scrollbar-3dlight-color:COLOUR; scrollbar-darkshadow-color:COLOUR
;</style>
Change the Cursor:
<style type="text/css">
body{cursor:CURSOR TYPE (crosshair,hand,e-resize,n-resize,sw-resize)}
</style>
|