Html 为 css 指定基本 url
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3812375/
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
Specifying base url for css
提问by rhlee
I had to split up a long css file. I put the smaller css files within a styles
directory.
我不得不拆分一个很长的 css 文件。我将较小的 css 文件放在一个styles
目录中。
Now I have to update the the urls to go up one level with the ../
notation.
现在我必须更新网址以使用../
符号上升一级。
Is there anyway to specify the base URL from which to load assets like with the base tag in HTML, but with CSS?
无论如何要指定从其中加载资产的基本 URL,例如 HTML 中的 base 标记,但使用 CSS?
采纳答案by BalusC
No, there isn't. I suggest to place the CSS images in at least the same level as the CSS file so that you don't need to go backwards in the path. E.g. /css
folder for CSS files and /css/images
folder for CSS images. Then you can consistently use url('images/name.ext')
for CSS images. This way you can place the root /css
folder practically everywhere without fiddling with the image URL's.
不,没有。我建议将 CSS 图像至少放置在与 CSS 文件相同的级别,这样您就不需要在路径中倒退。例如,/css
用于存放 CSS 文件的文件/css/images
夹和存放 CSS 图像的文件夹。然后你可以一直使用url('images/name.ext')
CSS 图像。通过这种方式,您几乎可以将根/css
文件夹放置在任何地方,而无需摆弄图像 URL。
回答by BBaysinger
As an alternative, you could dynamically add a class to your body tag, and use that in selectors to override css URLs depending on which directory your file is served from.
作为替代方案,您可以向 body 标签动态添加一个类,并在选择器中使用它来覆盖 css URL,具体取决于您的文件来自哪个目录。
回答by Guybrush
An alternative way to set the base directory in the CSS (which seems to be impossible) is to set the base directory of the HTML document with the <base>
tag. This tag is not well known in the community but I found a nice tutorial in the web:
在 CSS 中设置基目录的另一种方法(这似乎是不可能的)是使用<base>
标记设置 HTML 文档的基目录。这个标签在社区中并不为人所知,但我在网上找到了一个不错的教程:
https://webdesign.tutsplus.com/articles/quick-tip-set-relative-urls-with-the-base-tag--cms-21399
https://webdesign.tutsplus.com/articles/quick-tip-set-relative-urls-with-the-base-tag--cms-21399
It seems to be totally a good solution.
这似乎是一个很好的解决方案。