PDA

View Full Version : Resolved Transfer CSS styles from a HTML doucment to a seperate style sheet?



MOD YOU UPP
Jul 26th, 2010, 10:56 PM
Hi

I have been in the process of coding my website, and I decided that I want to move all or most of the css into an external style sheet. I already have one that my site is using but I only used to to do a few things. Most of the css in my site is in a style tag.

What is the quickest way to transfer it into a style sheet? How should I go about doing this?

Bar2aYunie
Jul 26th, 2010, 11:00 PM
Create a new file and place all of the styles inside. Leave out the style tags, so you only see the style names and specifications.

eg:



body {
font-family:verdana,arial,helvetica;
font-size:80%;
margin:20px;
color:#000;
background:#FFF;
}


Save this file as Style.css (or another name, as long as the extension is .css).

Then on your files add a link in the head section with a link to your style sheet:


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

Done!

MOD YOU UPP
Jul 26th, 2010, 11:03 PM
Yeah, well it isn't quite that simple for me. Take a look at my page source and you'll see what I mean.

Bar2aYunie
Jul 26th, 2010, 11:09 PM
Okay, well, the way I see it is that you have multiple tables nested within each other...right? And you want to style different cells. Then you'd have to create different classes for those cells. So if you have 8 different styles for your cells, you have to create 8 different cell styles. That'd be possible right? Or am I missing something else?

VIPStephan
Jul 26th, 2010, 11:10 PM
You know, with a terrible table layout like that it doesn’t matter anyway that you have inline styles. I, as picky as I am, would recommend you to start from scratch, and this time at the right foot, i. e. with semantic HTML (http://en.wikipedia.org/wiki/Semantic_HTML) and external CSS.

But for a superficial solution using your current code I’d say assign a specific class to each element that has inline styles now (the ones that are similar can have similar classes, too), and apply the styles from the external file using the class selector then.

MOD YOU UPP
Jul 27th, 2010, 01:11 AM
You know, with a terrible table layout like that it doesn’t matter anyway that you have inline styles. I, as picky as I am, would recommend you to start from scratch, and this time at the right foot, i. e. with semantic HTML (http://en.wikipedia.org/wiki/Semantic_HTML) and external CSS.

But for a superficial solution using your current code I’d say assign a specific class to each element that has inline styles now (the ones that are similar can have similar classes, too), and apply the styles from the external file using the class selector then.

Wow. That seems a bit harsh.

I never asked for advice on anything other than css. No need to go bashing the way I choose to code my site. I know most web designers feel that tables are bad for layout, but in my opinion they're great. So what if google can't index part of my page? Most of my clients will come from other sources.