【发布时间】:2016-08-17 16:37:10
【问题描述】:
在我的应用程序中,我使用了不同的字体和引导程序的字形图标。 为了在所有浏览器中查看结果,我将所有必需的字体类型(woff、tft、svg、..)放在字体中。 对于引导图标,我只是将必要的类型放在字体文件夹中。
如果我去本地主机,一切正常。在所有浏览器中,我都可以看到结果。
但是现在我将我的应用程序(战争)部署在了一个真实的服务器上。 在 fireFox 中我仍然可以看到图标和字体,但在 Chrome 和 IE 中看不到。 我在控制台中收到以下错误:
http://myTestServer.com/admin-UI/fonts/source-sans-pro/Source_Sans_Pro_400.woff Failed to load resource: the server responded with a status of 500 (Internal Server Error)
...
GET http://myTestServer.com/admin-UI/fonts/glyphicons-halflings-regular.woff2
GET http://myTestServer.com/admin-UI/fonts/glyphicons-halflings-regular.woff
GET http://myTestServer.com/admin-UI/fonts/glyphicons-halflings-regular.ttf
我不明白,为什么它在本地工作而不是在真实服务器上工作。 有人知道这个问题吗?
我的 CSS:
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: url('../fonts/source-sans-pro/Source_Sans_Pro_300.eot');
src: url('../fonts/source-sans-pro/Source_Sans_Pro_300.eot?#iefix') format('embedded-opentype'),
url('../fonts/source-sans-pro/Source_Sans_Pro_300.woff') format('woff'),
url('../fonts/source-sans-pro/Source_Sans_Pro_300.ttf') format('truetype'),
url('../fonts/source-sans-pro/Source_Sans_Pro_300.svg#SourceSansPro') format('svg');
谢谢!
更新:
之前的index.html(只在spring Boot的localhost服务器上工作):
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
index.html after(这在 tomcat 和 myServer 中都有效)
<!-- Bootstrap Core CSS - tomcat-->
<link href="http://localhost:8080/adminUI/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Core CSS -myTestServer-->
<link href="http://myTestServer.com/adminUI/css/bootstrap.min.css" rel="stylesheet">
main.css 我还加了绝对路径。我现在的问题是,有没有办法用变量替换绝对路径:“http://..../”。
如果我使用相对路径,那将是与开始时相同的问题。
我希望你明白我的意思。
【问题讨论】:
-
使用绝对路径在css中包含字体文件
-
引导字体文件怎么样?它们也必须在 CSS 中吗?我认为引导程序会自动在字体文件夹中找到它们。我应该如何命名引导程序的字体,以便它检测文件?
标签: css twitter-bootstrap google-chrome internet-explorer firefox