External Style Sheet

Two or more sheets

[mvaz]

Hello, could the experts please advise me if I can link two or more stylesheets into one html or php document? If so, is there any difference in linking the first and the rest stylesheets. Thanks in advance ☺

[Fotiman]

Yes, you can link in multiple stylesheets. Try not to go overboard, because each will require another HTTP request to the server (which, if there are enough of them, can negatively impact performance).

Suppose you have 2 CSS files that look like this:

/* A.css */
p { color: red; }
#footer p { font-size: 80%; }

/* B.css */
p { color: blue; font-size: 10px; }

You could link them in like this:

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

A.css would be read in first, so all <p> elements would have red color and the footer would have 80% font-size.

Next, B.css is going to override the color that was defined in A.css. Because the rule for <p> has the same specificity, the last one defined is going to be used. So, the color for all <p> elements changes to blue, and the font-size for all <p> elements except those in the #footer will change to 10px. The <p> in #footer will remain at 80% of the original, though, because it has a higher specificity.

Hope that helps.