Html 如何包含保存在目录中的所有css?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2326502/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to include all css kept in a directory?
提问by Rakesh Juyal
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:-
是否可以在 html 中一次包含多个 css?或者更准确地说,是否可以一次性将所有 css 包含在一个目录中?
就像目前我们所做的是:-
<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?
是否可以?或者有没有其他选择?
回答by Abram Simon
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.
您可以创建一个包含在每个页面中的主样式表,并且可以在该 css 文件@import
中包含其他样式表。
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.
这并不能解决必须手动包含每个单独的 css 文件的问题,但至少它将它封装在主样式表中,因此您不必在每个 html 文件中重复所有引用。如果你添加额外的 css 文件,你只需要在主 css 中添加一个引用,所有页面都可以访问它。
Example HTML CSS Reference:
示例 HTML CSS 参考:
<link href="master.css" type="text/css" />
Example Master CSS (master.css):
示例主 CSS (master.css):
@import url(style1.css);
@import url(style2.css);
@import url(style3.css);
Read more about when to use @import and it's compatibility with older browsers.
阅读有关何时使用 @import 以及它与旧浏览器的兼容性的更多信息。
回答by Skilldrick
回答by a'r
No it's not possible to use wildcards in a href. You will need to specify a link tag for every css file you need to include.
不,不可能在 href 中使用通配符。您需要为需要包含的每个 css 文件指定一个链接标记。
回答by JREAM
Unless I'm mistaken, this can be done quite nicely (though still manually) similar to JavaScript.
除非我弄错了,这可以很好地完成(尽管仍然是手动的),类似于 JavaScript。
./styles/
./layouts/
all.css <-- Each subfolder has this
header.css
footer.css
nav.css
./main.css <-- Main CSS file
Inside ./styles/layouts/all.css
do you import:
./styles/layouts/all.css
你在里面导入:
@import 'layouts/header.css';
@import 'layouts/footer.css';
@import 'layouts/nav.css';
Right, this separates the minor logic in CSS organizatoin (which is good IMHO).
是的,这将 CSS 组织中的次要逻辑分开(恕我直言,这很好)。
Then, as many "all.css" files in subfolders there are, just include them (Example):
然后,子文件夹中有许多“all.css”文件,只需包含它们(示例):
main.css
主文件
@import 'variables/all.css';
@import 'layouts/all.css';
I think thats rather nice...
我觉得还不错。。。
回答by SLaks
You could write a server-side script that concatenate all of the files in the directory and sends that to the client, then put the script in a <link>
tag.
您可以编写一个服务器端脚本,该脚本连接目录中的所有文件并将其发送到客户端,然后将该脚本放入一个<link>
标记中。
However, beware of syntax errors.
但是,请注意语法错误。
回答by Itay Moav -Malimovka
It is impossible to do it client side. It is possible to do it with the help of a server side technology. But, the best approach would be to incorporate all CSS into a single file and include that.
If you still want to keep css splited to files, do what many do and use a build tool thay incorporate all css into one file just for the production/testing server
客户端是不可能做到的。在服务器端技术的帮助下可以做到这一点。但是,最好的方法是将所有 CSS 合并到一个文件中并包含它。
如果您仍然希望将 css 拆分为文件,请执行许多操作并使用构建工具将所有 css 合并到一个文件中,仅用于生产/测试服务器
回答by frx08
you could use php to list all file with css extension in that directory...
您可以使用 php 列出该目录中所有带有 css 扩展名的文件...
$fp = opendir($dir);
while ($file = readdir($fp)) {
if (strpos($file, '.css',1))
$results[] = $file;
}
closedir($fp);
...and than do a foreach construct to incude css's
...而不是做一个 foreach 构造来包含 css 的
回答by Oddthinking
There may be some possible workarounds:
可能有一些可能的解决方法:
Consider the idea of importing a PHP page (e.g. ./tabs_css/allcss.php) which concatenates and returns all the css in the directory. This may be a little CPU intensive.
Consider creating a combo css file which is concatenation of all of your CSS files. This might be possible to create automatically by adding special hooks to your version-control system.
考虑导入一个 PHP 页面(例如 ./tabs_css/allcss.php)的想法,该页面连接并返回目录中的所有 css。这可能有点 CPU 密集型。
考虑创建一个组合 css 文件,它是所有 CSS 文件的串联。这可能可以通过向版本控制系统添加特殊钩子来自动创建。