This is a discussion on "How to link HTML page to CSS file" within the Web Page Design section. This forum, and the thread "How to link HTML page to CSS file are both part of the Design Your Website category.
|
|
|
|
|
![]() |
||
How to link HTML page to CSS file
|
||
| Notices |
![]() |
|
|
LinkBack | Thread Tools |
|
#1
|
|||
|
|||
|
How to link HTML page to CSS file
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) |
|
|
|
#2
|
||||
|
||||
|
Re: How to link HTML page to CSS file
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. |
|
#3
|
|||
|
|||
|
Re: How to link HTML page to CSS file
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. |
|
#4
|
|||
|
|||
|
Re: How to link HTML page to CSS file
Use some free server space .... Lycos offer tripod which is pretty decent
|
|
#5
|
||||
|
||||
|
Re: How to link HTML page to CSS file
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
|
|
#6
|
|||
|
|||
|
Re: How to link HTML page to CSS file
Is that mean if one is using CSS he doesn't require tables to design a site?
|
|
#7
|
|||
|
|||
|
Re: How to link HTML page to CSS file
That is what it means.
Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
|
|
#8
|
||||
|
||||
|
Re: How to link HTML page to CSS file
|
|
#9
|
|||
|
|||
|
Re: How to link HTML page to CSS file
Then how to divide a page into 3 or 4 parts?
i.e. header, footer and so on... |
|
#10
|
||||
|
||||
|
Re: How to link HTML page to CSS file
|
|
#11
|
|||
|
|||
|
Re: How to link HTML page to CSS file
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]-->
Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
Last edited by moojoo; Dec 19th, 2006 at 15:26. |
|
#12
|
||||
|
||||
|
Re: How to link HTML page to CSS file
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. |
|
#13
|
|||
|
|||
|
Re: How to link HTML page to CSS file
Ok fine but we can't date any more. You are too pushy.
Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
|
|
#14
|
||||
|
||||
|
Re: How to link HTML page to CSS file
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.
|
|
#15
|
|||
|
|||
|
Re: How to link HTML page to CSS file
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 |
|
#16
|
||||
|
||||
|
Re: How to link HTML page to CSS file
It's best to start a new thread if you have a new question.
|
|
#17
|
|||
|
|||
|
Re: How to link HTML page to CSS file
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.
Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
|
|
#18
|
|||
|
|||
|
Re: How to link HTML page to CSS file
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... |
|
#19
|
||||
|
||||
|
Re: How to link HTML page to CSS file
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.
|