How to link HTML page to CSS file

[winwin]

Hi,
I'm new to this forum and very much new to web site designing. Resently I came to know that by using CSS one can save a lot of time in redesigning or maintaining a site.
Could someone please explain me how to creat this CSS file and how to link HTML pages to this CSS file.
I have little knowledge about CSS but don't know how to link these two ( CSS and HTML)

[Ryan Fait]

Well, like HTML, Cascading Style Sheets (CSS) are a pages of sorts. Whereas HTML is for hard content, like text, images and links, CSS is for a pages design. You don't need tables to organize a site. This is the CSS that controls my website:

http://ryanfait.com/workspace/css/layout.css

CSS and HTML work in harmony to make text look the way you want it, <div>'s to appear a certain way, or elements do out of the ordinary things (like giving a certain width and height to a link). There is no good way to code CSS other than by hand. There are programs to aid you in it, but any WYSIWYG website editor won't do things very well because it won't be able to take into account everything on the page and adjust the CSS for the site as a whole. It's a fairly simple language, but until you understand what it's capable of, you won't be able to do much with it.

http://w3schools.com/css/
http://csszengard.com/
http://css.maxdesign.com.au/

The above sites are all good resources and examples.

As for linking CSS into HTML, you use the link tag.

<link rel="stylesheet" type="text/css" href="stylesheet.css" media="screen" />

The task of learning CSS may seem daunting, but once you get the basics down, it's all uphill from there.

[winwin]

Can you take the pain for me!
Thanks ryanfait for providing the information and useful links.
As of now I'm learning CSS from w3school.com itself.
Can you tell me how can I check my coding for CSS and HTML without uploading it on a server. Is there any option or I've to buy some server space.

[Accurax]

Use some free server space .... Lycos offer tripod which is pretty decent

[Ryan Fait]

There is a free CSS validator that you can copy and paste code in to see if it's valid. It's also not that hard to set up a small server environment on most computers. It's already done on Macs if you've got one of those

[winwin]

Is that mean if one is using CSS he doesn't require tables to design a site?

[moojoo]

That is what it means.

[Ryan Fait]

Yep. Look at my site:

http://ryanfait.com/

Not a single table on my entire site.

[winwin]

Then how to divide a page into 3 or 4 parts?
i.e. header, footer and so on...

[Ryan Fait]

CSS does it all.

http://css.maxdesign.com.au/

[moojoo]

Generally you would have 4 style sheets. One for normal use, one for print, and one for each version of IE you plan to cater to.

<link rel="stylesheet" href="path/to/css" media="screen" type="text/css" />

<link rel="stylesheet" href="path/to/css" media="print" type="text/css" />

<!--[if IE 6]>
<link rel="stylesheet" href="path/to/css" media="screen" type="text/css" />
<![endif]-->

<!--[if IE 7]>
<link rel="stylesheet" href="path/to/css" media="screen" type="text/css" />
<![endif]-->

[Ryan Fait]

We're dealing with a beginner here, moojoo.

You should put the location of the CSS file inside the href tags of link. The if statements are not necessary, but if you want to add additional CSS properties for the different versions of IE, that is the best way to do so.

[moojoo]

Ok fine but we can't date any more. You are too pushy.

[Ryan Fait]

Haha, well at least I didn't tell you that you were wrong! I'll take you out to a fancy dinner tonight, my treat.

[winwin]

Thanks to both of you.
So I think now instead of troubling you people, can I ask a link in this forum where I can learn and discuss basics of CSS coding.
BTW If you ppl allow me, I can start asking my question here itself

[Ryan Fait]

It's best to start a new thread if you have a new question.

[moojoo]

Also any time you need help never be afraid to ask. We may be a bit loony but we are also good at this stuff.

[winwin]

OK
My questions will be regarding CSS and HTML coding for the same
so what should I name the thread?
one more thing if someone can tell me, what are the limitations of CSS?
What I understand is one can change the colors, text font etc in one shot but if one has to include some links, texts or pictures in a site he has to change all the pages manually or creat a new CSS file.
Please correct me where I'm wrong...

[Ryan Fait]

Well, CSS is just a styling language. HTML handles content and CSS makes it look pretty. You can't use CSS to add links or replicate the img tag (but you can assign a background to a div so it looks like an image). If you're talking about what it can do for changing the looks of a page, it's basically boundless.