How to include all css kept in a directory?

Question

Is it possible to include multiple css at once in html? Or to be precise, is it possible to include all css placed in a directory, in one go?
like at present what we do is:-

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

I need something like:-

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

Is it possible? Or is there any alternative of this?

Answer 1

You could create a master stylesheet that you include in every page, and within that css file you can use @import to include the others.

This doesn't solve the problem of having to manually include each individual css file, but at least it encapsulates it within the master stylesheet so you don't have to repeat all of the references in every html file. If you add additional css files you will only need to add a reference in the master css and all pages will get access to it.

Example HTML CSS Reference:

<link href="master.css" type="text/css" /> 

Example Master CSS (master.css):

@import url(style1.css); @import url(style2.css); @import url(style3.css); 

Read more about when to use @import and its compatibility with older browsers.

Answer 2

You'd need to do this serverside. If you're using PHP, have a look at glob.

For example:

foreach (glob("path/to/css/*.css") as $css) {     echo "<link type='text/css' rel='stylesheet' href='$css'>\n"; }