Links in HTML
Basic Link
<a href="http://WWW">text text</a>
Open Link in New Window
<a href="http://WWW" target="_blank">text text</a>
Linking an Image
<a href="http://WWW"><img src="http://IMG" border=0></a>
*border=0 will prevent a box from forming around your image
Linking an Email Address
<a href="mailto:email@www.com">text text</a>
With a Subject Line
<a href="mailto:email@www.com?subject=SUBJECT HERE">text text</a>
Targetting Links
<a href="http://WWW" target="NAME">text text</a>
Use this when you're working with frames. Use the frame's name as a target.
Links in CSS
<style type="text/css">
A:LINK{
font-family: FONT NAME;
font-size: #pt;
color: COLOR;
font-weight: normal;
text-decoration: none; }
</style>
To control visited links, replace A:LINK with A:VISITED.
For controls when mouse is over a link, replace A:LINK with A:HOVER.
Font weight can also be bold or italic.
Replace text-decoration: none for different effects:
text-decoration:underline
text-decoration:underline overline
background-color:COLORHERE
text-decoration:line-through
cursor:crosshair
cursor:n-resize
cursor:s-resize
cursor:w-resize
cursor:e-resize
cursor:wait
font-weight:bold
font-weight:italic
font-size:#pt
You can also combine a couple.
Dropdown Menu Links
<form><select name=select size="1"
style="background-color:COLOUR;
font size:#pt; font-family:FONT;
color:COLOUR"
onchange="location.href=
(form.select.options[form.select.selectedIndex].value)">
<option value="http://WWW">Link</option>
<option value="http://WWW">Link</option>
<option value="http://WWW">Link</option>
</select></form>
Changing size will determine the number of 'options' displayed at once. However, anything over '1' will not be a dropdown, it will be a scrollbox.
Button Links
<FORM METHOD="link" ACTION="http://WWW"><INPUT TYPE="submit" VALUE="text text"></FORM>
Email Button
<FORM METHOD="link" ACTION="mailto:email@www.com"> <INPUT TYPE="submit" VALUE="Email Button"></FORM>
Coloured Buttons
<FORM METHOD="link" ACTION="http://WWW">
<INPUT TYPE="submit" VALUE="Colour Button" style="font-family:FONT" style="border style:solid" style="background:COLOR" style="color:COLOR"></FORM>
*Firefox users will not see coloured buttons.
Coloured Image Buttons
<FORM method="link" action="http://WWW"><INPUT TYPE="IMAGE" src="http://IMG" height="#" width="#" style="border style:solid" style="color:COLOUR">
*Firefox users will not see the coloured border.
|
|