Results 1 to 7 of 7
Related
-
Cascading Style Sheets - CSS Generator Forum: CSS Forum
Replies: 1 -
HOw do i make a url work on my space? Forum: Myspace Forum
Replies: 1 -
My stylesheet is being partially ignored Forum: CSS Forum
Replies: 2
-
09-28-2005, 08:03 AM #1
How do make my cascading stylesheet work?
As a newbie I have created (I think) a stylesheet to test my knowledge of CSS - it doesn't work can you tell me what's wrong..
Fonts remain unchanged when run.. (all the fonts used are on my computer so I haven't used the serif, sans serif bits, both files are in the same directory)
**********************************************
/* Stylsheet saved as "csstestsheet.css" */
/* Font Face = f */
f1 { font-family: comic sans ms; }
f2 { font-family: copperplate gothic bold; }
f3 { font-family: century gothic; }
/* Font Color = c */
c1 { color: black; }
c2 { color: blue; }
c3 { color: red; }
/* Font Size = s */
s1 { font-size: smaller; }
s2 { font-size: small; }
s3 { font-size: normal; }
s4 { font-size: large; }
s5 { font-size: 48pt; }
************************************
and the html test page goes like this..
************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>testbed</title>
<link rel="stylesheet" href="csstestsheet.css" type=" text/css" >
</head>
<body>
Font face test <br><br>
<f1>This should be comic sans</f1><br>
<f2>This should be copperplate</f2><br>
<f3>This should be century gothic</f3>
<br><br>
Font color test <br><br>
<c1>This should be black</c1><br>
<c2>This should be blue</c2><br>
<c3>This should be red</c3>
<br><br>
Font size test <br><br>
<s1>This should be very small</s1><br>
<s2>This should be small</s2><br>
<s3>This should be normal</s3><br>
<s4>This should be large</s4><br>
<s5>This should be very large</s5>
<br><br>
</body>
</html>Glenvern
-
09-28-2005, 09:37 AM #2
Re: How do make my stylesheet work?
Try this
<div class="f1">This should be comic sans</div>
Dave
-
09-28-2005, 09:45 AM #3
Re: How do make my stylesheet work?
Where do I put it..??
I tried it in the HTML page
(replaced <f1> with your <div class="f1"> )
but nothing happened..Glenvern
-
09-28-2005, 09:52 AM #4
Re: How do make my stylesheet work?
Keep in mind I am not a CSS pro, that is Dean and he seems to have taken a long vacation
I think I missed something
f1 { font-family: comic sans ms; }
(change to in your stylesheet)
div.f1 { font-family: comic sans ms; }
If you are still having a problem can you post a link.
Dave
-
09-28-2005, 02:20 PM #5bald headed old fart
Status- Offline
Join Date- Aug 2003
Location- chertsey, a small town 25 miles south west of london, england.
Posts- 739
Re: How do make my stylesheet work?
Hi there Glenvern,
try it like this...
Code:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>testbed</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> <!-- #f1 { font-family: 'comic sans ms'; margin-top:20px; } #f2 { font-family: 'copperplate gothic bold'; } #f3 { font-family: 'century gothic'; margin-bottom:20px; } #c1 { color: black; margin-top:20px; } #c2 { color: blue; } #c3 { color: red; margin-bottom:20px; } #s1 { font-size: smaller; margin-top:20px; } #s2 { font-size: small; } #s3 { font-size: normal; } #s4 { font-size: large; } #s5 { font-size: 48pt; margin-bottom:20px; } --> </style> </head> <body> <div>Font face test </div> <div id="f1">This should be comic sans</div> <div id="f2">This should be copperplate</div> <div id="f3">This should be century gothic</div> <div>Font color test </div> <div id="c1">This should be black</div> <div id="c2">This should be blue</div> <div id="c3">This should be red</div> <div>Font size test </div> <div id="s1">This should be very small</div> <div id="s2">This should be small</div> <div id="s3">This should be normal</div> <div id="s4">This should be large</div> <div id="s5">This should be very large</div> </body> </html>
Code:<link rel="stylesheet" href="csstestsheet.css" type=" text/css" >
The correct method is to use the margin rule as you can see in the stylesheet.
Now a couple of suggestions. Get into the habit of always using a full DOCTYPE.
It stops IE from going into Quirks Mode. Also use the <meta> tag that I have
used or similar. It will be required if you intend to validate your pages. Lastly code
your pages in Firefox and then tweak for IE, it will save you a lot of heartache.Last edited by coothead; 09-28-2005 at 02:29 PM.
-
09-29-2005, 01:39 AM #6
Re: How do make my stylesheet work?
Thank you Coothead that is just great -
One question - it would appear to me being new to this, that you have to do as much code writing with CSS as with with HTML
eg. <div id="f1"> seems to be no more of an advantage than doing <font face="whatever"> bearing in mind I have had to write a whole page of stylesheet prior to this..??Glenvern
-
09-29-2005, 05:13 AM #7bald headed old fart
Status- Offline
Join Date- Aug 2003
Location- chertsey, a small town 25 miles south west of london, england.
Posts- 739
Re: How do make my stylesheet work?
Hi there Glenvern,
this link may provide the answers...
CSS advantages
Cloudjiffy- PaaS for Developers
10-05-2020, 12:30 AM in Web Hosting Forum