As some of you know, I have been working on my website. Anyways, I want to make a CSS script for it. I have the text code that I want to use. But my problem is, I don’t know how to save it as a .CSS file. I have played around with Dreamweaver a lot trying to figure it out.
Anyone know how I can do this? I know I could just put the code itself right in the HTML, but that is messy and annoying. I would rather just link to a .CSS file. But I don’t know how to make it.
Thanks for the help,
TraceR
<link type=“text/css” rel=“stylesheet” href=“http://hs-mc.org/base.css”>
or
<link type=“text/css” rel=“stylesheet” href="/base.css">
or [relative link]
<link type=“text/css” rel=“stylesheet” href=“base.css”>
or
<style type=“text/css”>
<!–
/* to ignore in netscape 4, which would crash on this style sheet */
@import url(“http://hs-mc.org/normal.css”);
–>
</style>
… all in the file’s header [in this case the hs-mc.org index page… that site may go down though soonish]
Ok I’m a little confused. I know how to link to a .CSS file in HTML. What I don’t know how to do is create the actual .CSS file to link to.
I don’t know anything about Dreamweaver, but all you need to do to create a CSS file is use a text editor to type in your code and the save the file as a CSS file.
Eg, When you save it, type in the file name as “filename.css” (without the " ").
Since noone has explained this part, which may or may not be the bit you’re having trouble with (depending on whether I’m misunderstanding), the contents of the .css file is just the text that would normally go between <style> and </style>.
The text in <sometag style=""> can’t be moved directly into the .css file, but if the same style is used often in the pages it should be changed into <sometag class=“someclass”> and add
sometag.someclass {
<<style>>
}
to the .css file.
HTH
Hey that worked! Awesome. I didn’t know Notepad could save text to multipule formats.
Thanks man,
TraceR
Technically Notepad isn’t saving to multiple formats.
It can open/save any text file (or anything where the formatting is also text, like html, css, xml, etc, etc), but you have to work from there.
Same as any other text editor.
Yup, the css and html files are actually just normal text files with a .htm/.css extension.
Ok, I updated my website with the CSS script. IMO it looks better than just using the default. What do you guys think? I am still new to CSS as you can see. But I think I understand it a lot more now. If you have any suggestions on how I can tweak the code anymore, let me know.
Thanks guys,
TraceR
You can use css for all your font/cell settings actually.
What you can do in your css file is for instance (this is called creating a new class):
.extra {
FONT-SIZE: 12px;
TEXT-TRANSFORM: none;
COLOR: #FFFFFF;
FONT-FAMILY: “Verdana”;
vertical-align: top;
padding: 0px;
border-style: solid;
border-color: #FFFFFF #383878 #383878 #383878;
border-width: 1px 2px 3px 4px;
}
And then in your cell (in the html code of your page) do this:
<td class=“extra”>
This will make everything in that cell follow that style.
You can also change classes anywhere on your page (irrelevant to cells and tables. it’ll go right through it)
By typing in <span class=“extra”> and </span> when you want that style to stop. I use that for instace for single lines of text with a different style. What you’d normally do with for instance but this way you can change the font as well… without all the extra font tags and everything.
to give you some ideas here’s a link to my stylesheet for alienhelpdesk.com
http://www.alienhelpdesk.com/stylesheet3.css
Just look at that w3schools site someone referenced. That place really has all the data you need.
Ahem.
font-family: “Verdana”, sans-serif;
You can’t just assume everyone has the Verdana font.
yes I can 
Okay, you can, but you shouldn’t
LOL guys.
Thanks for the script macouno. I would like to make my font size 12px. But on some pages, such as my Resume page, some of the fonts are bigger than others. Is there a way I can select the font I want to be 12px and select the other font that I would like to be bigger? Because I if I use the script for all font size, they will all be the same size.
Geheheh, indeed a css tutorial from w3c would be really usefull. When I discovered the use of css, I’m a css freak, I build my website in seconds in css without any tables. The most anoying part of css is, when you finally started to learn css, you’ll encounter that you need to know a lot of each tag to know what happens if you don’t use a tag in IE and Firefox appear to render it fine, while IE makes a mess of it. And sometimes a single tag can fix the whole problem, like you don’t want to use margins and you use margin: 0; while Firefox shows it fine, and IE wants you to declare all sides or it makes a mess of it. This happens with a few css code.
Anyways you want to have you website text in a size. Ok a freeware lesson css is comming here.
First we make a body, that means all the stuff inside it is default, the website got rendered with that stuff.
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #000000;
padding: 0px;
margin: 0px;
}
Now the text is default size of 8pt’s, now we want to have some places 12pt’s, well that’s easy. Now we’re gonna make a new style for P.
p.big_text{
font-size: 12pt;
}
Now when you write text in your website with:
some text</p>
it appears to be 8pt, now lets make the next line 12pt
<p class=“big_text”>some big text here</p>
Now that should fix the problem. 
It does the following, aah body in css says everything with is 8pt big, but wait a sec I see a <p class=“big_text”> mmh, it’s not default, so it needs something else. Lets look for big_text in css file, aaah found 12pt big, ok only make this until next </p> 12pt big. 
Really easy.
Let’s not forget paragraphs and headings.
/*** CSS **/
h1 { font-size:18px; }
h2 { font-size:16px; }
h3 { font-size:12px; font-weight:strong; }
p { font-size:12px; }
/*** HTML ***/
<h1>Heading 1</h1>
Paragraph text</p>
<h2>Heading 2</h2>
Paragraph under sub-heading</p>