If i can include css per page basis then should i mak different css file for each page if needed ?

Question

If i can include css per page basis then should i mak different css file for each page if needed other than reset css file?

i use eric meyer css reset code in main.css

Answer 1

Everything that is shared between multiple pages should go into a single CSS file.

If you have certain elements on only one page then it is ok to put this into an extra CSS file. This also prevents your main CSS file from getting to large.

Keep the following in mind: Don't repeat yourself. When you noticed that you put the same CSS configuration in two different CSS files, this is an indicator that this configuration should probably go into the main CSS file or both pages should at least use the same CSS file.

Edit:

You can give the elements that should share common settings the same class. E.g.

.foo {
    color: green;
}
/* in this case, is the same as : */

#div1, #div2 {
    color: green;
}


<div id="div1" class="foo">
</div>

<div id="div2" class="foo">
</div>

Also remember that elements can have more than one class, e.g. <div class="foo bar"></div>

Maybe a CSS introduction also helps.

Answer 2

A common solution is to put everything in one css file, with either small css files for parts that change or a class on body so you can write:

body.single #some:selector {
    #css
}

body.blog #some:selector {
    #css
}

As said before, don't repeat yourself!

Answer 3

Of course you can do this, but you should not, for two reasons (and more, which I can't think of right now):

1. You lose caching speed. While it's true that the page will be faster on first load (smaller CSS), each page needs to get its own CSS loaded. One CSS for all pages -- assuming it's not ridiculously huge -- lets the server cache and the client cache better. Mostly the latter is what we're trying to allow with one CSS.
2. Unless your site is truly beyond strange, you probably do NOT want to have different CSS for each page. A uniform look and feel demands a unified stylesheet.

As someone once told me on SO, "there are no absolutes, ever! :)" So while you might have a rare case that justifies many many CSS files, I recommend that you see if you can take advantage of unifying in one unless you have a good reason not to.

From your question it's not clear if you need help on using one stylesheet to address different elements on different pages. Generally, you can handle that by getting used to multiple classes, like:

<div class="one two three">

but CSS addressing is very flexible and you can do everything you want without having to use separate files. Unless you want to.