Main Content

Updates
To Do List
You
Health and Beauty
Reads
Jenni
Quizzes
Tutorials
The Domain
Dollmakers
Link Star-Girl.org
Question?
Plug Your Site
Index/Blog

Extra

Change The Skin
Jenni Fanlisting
Star-Girl.org Fanlisting
Webdesign Question?
Report An Error
MT Blog Archives
Nov-Apr 04 Archives
Feb-Nov 03 Archives

Sites and Projects

Shining Top Sites
Creme De La Femme
Starshine Boards
Starstruck Zine

Starshine.la Login

Username

Password



Linkage




Etc.

refreshes today
Link Effects


Do not copy this page word for word on your own site - it took me a million years to write! (Well, maybe that's a slight exaggeration...)

To use:
1. Copy the following code:



2. Choose the link effect(s) you want to use (if there's more than one, make sure they are separated by a semi colon ;)
3. Add the line of code to the code given in step one. If it says text decoration at the beginning, it should look like this at the end (if I was using an underline code):

<style type="text/css"> <!-- A:link{color: 000000; text-decoration: underline;} A:visited{color: 000000; text-decoration: none;} A:active{color: 000000; text-decoration: none;} A:hover{color: 000000; text-decoration: underline} --> </style> If it doesn't, it should just be added to the end of the code like this (using a dotted border for example):

<style type="text/css"> <!-- A:link{color: 000000; text-decoration: none;} A:visited{color: 000000; text-decoration: none;} A:active{color: 000000; text-decoration: none;} A:hover{color: 000000; text-decoration: none; border:1 dotted; border-color:#000000} --> </style> Remember that you can add a code to any of the 4 lines, all of them, or just the hover if you like. You can also change any of the '000000' to your own hex colour.

Solid Border | Dashed Border | Dotted Border

border:1 solid; border-color:#000000; <- Solid Border
border:1 dashed; border-color:#000000; <- Dashed Border
border:1 dotted; border-color:#000000; <- Dotted Border

Solid Border Underneath | Dashed Border Underneath | Dotted Border Underneath

border-bottom:1 solid #000000; <- Solid
border-bottom:1 dashed #000000; <- Dashed
border-bottom:1 dotted #000000; <- Dotted

Solid Border Above | Dashed Border Above | Dotted Border Above

border-top:1 solid #000000; <- Solid
border-top:1 dashed #000000; <- Dashed
border-top:1 dotted #000000; <- Dotted

Underline | Overline | Underline Overline | Line-Through

text-decoration:underline; <- Underline
text-decoration:overline; <- Overline
text-decoration:underline overline; <- Underline Overline
text-decoration:line-through; <- Line-Through

Inverts link colours | Inverts link colours | Makes links grey

filter:Invert(strength=3); height:9px <- Inverts
filter: invert(); height:0 <- Inverts
filter: gray(); height:0 <- Makes Grey

Drop Shadow | Blurred Drop Shadow | Blur

filter:dropshadow(color=#000000,offX=1,offY=1); height:7pt; <- Drop Shadow
filter:shadow(color=#000000,offX=1,offY=1); height:0 <- Shadow
filter:blur(add="0",direction="180",strength="2"); height:0; <- Blurs

Backwards Links | Upside Down Links

filter:fliph; height:0; <- Backwards
filter:flipv; height:0; <- Upside Down

Wavy Links | Wavy Links

height:0;color:000000; filter:wave(add=0,phase=4,freq=5,strength=2); <- Wavy
filter: wave(strength="1"); height:0; <- Wavy

capitalises the first letter | capitalises whole word | MAKES LINKS LOWERCASE

text-transform:capitalize; <- Capitalises 1st letter
text-transform:uppercase; <- All Capitals
text-transform:lowercase; <- All Lowercase

Glowing Links | Bold Links | Adds Background Colour | Transparent Links

filter:glow(color=000000, strength=5); height:0; <- Glow
font-weight:bold; <- Bold
background-color:000000; <- Background Colour
filter: mask; height:0; <- Transparent



Back | Forward

Advertised

Your Site Here?






All content and design is © Jennifer Brown 2005, unless otherwise stated. Please click *here* for more information.