Custom Style Sheets

liunx

Guest
I have found lots of stuff on Custom Style Sheets and what they are for. However, everything I have found does not tell me the basic HOW!<br />
<br />
I have created a .css file with the following style declarations:<br />
<br />
<br />
BODY { BACKGROUND-IMAGE: url(filename) } <br />
P1 {FONT-SIZE: 20pt}<br />
P2 {FONT-SIZE: 10pt}<br />
<br />
<br />
<br />
I then created the .html file that will use the style sheet, and wrote the following code:<br />
<br />
<br />
<HEAD><br />
<br />
<STYLE TYPE="./Resources/Style.css"><br />
</STYLE><br />
<br />
</HEAD><br />
<br />
<br />
<BODY><br />
<br />
<P1> This is the first option </P1><br />
<P2> This is the second option </P2><br />
<br />
</BODY><br />
<br />
<br />
Which I think is right. Unfortunately, the text does not change and there is no background.<br />
<br />
Have I missed something?<!--content-->first of all your link to your style sheet is wrong it should be<link rel="stylesheet" type="text/css" href=http://www.htmlforums.com/archive/index.php/"filename.css" /> <br />
second when we get to your style sheet itself and the parts that it refers to you are slightly off the mark try going through the CSS tutorial in <!-- w --><a class="postlink" href="http://www.w3schools.com">www.w3schools.com</a><!-- w --> and try again. <br />
<br />
practice makes perfect<!--content-->I had got my information from <!-- m --><a class="postlink" href="http://www.w3.org">http://www.w3.org</a><!-- m -->, but your reference already looks to be more informative.<br />
<br />
Thanks.<!--content-->What was wrong with my .css file again?<br />
<br />
Is it that you have to use pre-defined names? Because apart from that, I can't see anything else.<!--content-->your css file seems wrong as i don't see where you hot the P1 and P2 tags from<br />
<br />
in your css file you should have<br />
<br />
{background-image: url("filename")}<br />
p.1 {font-size: 20pt}<br />
p.2 {font-size: 10pt}<br />
<br />
<br />
and then in your html file you need <br />
<br />
<html><br />
<head><br />
<link rel="stylesheet" type="text/css" href=http://www.htmlforums.com/archive/index.php/"../Resources/Style.css" /><br />
</head><br />
<body><br />
<p class="1">This is the first option</p><br />
<p class="2">This is the second option</p><br />
</body><br />
</html><br />
<br />
<br />
This should help<!--content-->thanks - I understand how it works now<br />
<br />
the p1 and p2 tags were ones that I had made up - thinking that was how you do it - but I realise how very wrong that was now<!--content-->
 
Back
Top