|
|
body {
background-color: FFFFFF;
}
|
This styles the body of the web-page, you can place the 6 character code for the colour you want in place of the FFFFFF (this would give a white background at the moment).
|
|
|
a:link {
color: FF0000;
font-size: 15px;
border: none;
font-family: Tahoma;
text-decoration: none;
}
|
This styles a standard hyperlink on your web-page. you can place the 6 character code for the colour you want in place of the FF00 (this would give a red hyperlink at the moment). Fontsize in 'px' means how many pixels big you want the tall letters to be and is roughly equivalent to the font sizes on Microsoft word. The 'border' decides whether or not the link has a border around it. Personally i don't think this works and so I chose none (not many people use a border). However, if you want one the simple enter the number of 'px' border you want similar to fontsize. Font-family is simply which font you want to use (I am using Tahoma). text-decoration can style using things like 'underline' (very commonly used) or others. For a full list of css attributes, click here.
|
|
|
a:visited {
color: FF8800;
font-size: 15px;
border: none;
font-family: Tahoma;
text-decoration: none;
}
|
This styles a visited hyperlink on your web-page. you can place the 6 character code for the colour you want in place of the FF8800 (this would give an orange hyperlink at the moment). It is a good idea to have the visited links a different colour to others so the viewer know where they have and haven't been. Though this is not essential and I have opted not to.. Fontsize in 'px' means how many pixels big you want the tall letters to be and is roughly equivalent to the font sizes on Microsoft word. The 'border' decides whether or not the link has a border around it. Personally i don't think this works and so I chose none (not many people use a border). However, if you want one the simple enter the number of 'px' border you want similar to fontsize. Font-family is simply which font you want to use (I am using Tahoma). text-decoration can style using things like 'underline' (very commonly used) or others. For a full list of css attributes, click here.
|
|
|
a:link:hover {
color: FF0000;
font-size: 15px;
border: none;
font-family: Tahoma;
text-decoration: underline;
}
|
This styles a standard hyperlink on your web-page when the mouse is over it. I strongly advise that you have some sort of change between a normal link and when it is being hovered, this helps to distinguish it from normal text. you can place the 6 character code for the colour you want in place of the FF0000 (this would give a red hyperlink at the moment). Fontsize in 'px' means how many pixels big you want the tall letters to be and is roughly equivalent to the font sizes on Microsoft word. The 'border' decides whether or not the link has a border around it. Personally i don't think this works and so I chose none (not many people use a border). However, if you want one the simple enter the number of 'px' border you want similar to fontsize. Font-family is simply which font you want to use (I am using Tahoma). text-decoration can style using things like 'underline'. I find this is a great way to distinguish a hyperlink subtly is to have it underline when hovered. For a full list of css attributes, click here.
|
|
|
a:visited:hover {
color: FF8800;
font-size: 15px;
border: none;
font-family: Tahoma;
text-decoration: underline;
}
|
This styles a visited hyperlink on your web-page when hovered. With these it is a good idea to have them the same style as a normal visited link but with the change from normal to hover applied. For example a visited link still underlines when hovered but is orange instead of red. you can place the 6 character code for the colour you want in place of the FF8800 (this would give an orange hyperlink at the moment). Fontsize in 'px' means how many pixels big you want the tall letters to be and is roughly equivalent to the font sizes on Microsoft word. The 'border' decides whether or not the link has a border around it. Personally i don't think this works and so I chose none (not many people use a border). However, if you want one the simple enter the number of 'px' border you want similar to fontsize. Font-family is simply which font you want to use (I am using Tahoma). text-decoration can style using things like 'underline' (very commonly used) or others. For a full list of css attributes, click here.
|
|
|
a {
color: 000000;
font-size: 15px;
font-family: Tahoma;
text-decoration: none;
}
|
This styles all the general text on you web-page (but has to be contained within the <a> </a> tags). First and foremost, make sure it is readable when up against your selected background. You can place the 6 character code for the colour you want in place of the 000000 (this would give black text at the moment). Fontsize in 'px' means how many pixels big you want the tall letters to be and is roughly equivalent to the font sizes on Microsoft word. Font-family is simply which font you want to use (I am using Tahoma). text-decoration can style using things like 'underline' (less commonly used for plain text) or others. For a full list of css attributes, click here.
|
|
|
h1 {
color: FFFFFF;
font-size: 30px;
font-family: Tahoma;
text-decoration: none;
}
|
This can be used to style the headings of you web-page (can be done for sub headings too). These should have subtle but noticeable changes from the normal text, for example bigger font size, or bold and underlined. They can be styled in the same way as normal text.
|
|