Bootstrap图标在本地加载,但在线时不能加载
基本上我有以下的HTML:
<button class="disabled btn-primary btn" type="submit" disabled=""> <i class="glyphicon glyphicon-ban-circle"></i> Log in </button>
本地图标在button上显示的很好,但是当我在Windows Azure上运行时,我得到下面的button,带有一个奇怪的外观前缀,而不是图标:
看着这个,我意识到,当访问我的网站在本地浏览器将尝试加载文件:/Content/fonts/glyphicons-halflings-regular.woff(它成功),而当在线(在azure色),它会尝试载入:/fonts/glyphicons-halflings-regular.woff
为什么不把它在本地执行的/ Content前缀。
我正在使用标准的引导文件,这是完全相同的网站在本地和在线运行。
另外我以下列方式捆绑内容:
bundles.Add(new StyleBundle("~/Content/bootstrapcss").Include( "~/Content/bootstrap/bootstrap.css"));
而文件结构看起来如下:
另外bootstrap正在寻找这样的文件:
url('../fonts/glyphicons-halflings-regular.woff')
所以我会假设它会查找内容文件夹,而不是根目录,因为它当前驻留在Content / bootstrapcss文件夹中。
我们最近有类似的问题(虽然我们使用metroUI
– http://metroui.org.ua/
)。 基本上,事实certificate,我们捆绑了css文件,因此当我们在Windows Azure中部署应用程序时,没有任何字体被加载。
在我们的例子中,我们有以下目录结构:
而modern.css引用的是类似的字体
../fonts/iconFont.eot
我们打包了这样的CSS文件:
bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/css/modern.css", "~/Content/css/modern-responsive.css"));
由于绑定,应用程序正在应用程序根目录下查找/fonts
目录中的/fonts
,这显然不在那里。
长话短说,我们结束了更改包名称:
bundles.Add(new StyleBundle("~/Content/css/metroUI").Include( "~/Content/css/modern.css", "~/Content/css/modern-responsive.css"));
一旦包名更改,事情就开始正常工作。
如果您已经下载了包含引导程序图标的theme.zip或theme.rar,请在解压缩之前执行以下操作:
- 右键点击压缩包
- 如果可见,请选中“取消阻止”框
要使图标正常工作,我必须将文件夹权限设置为图像所在的文件夹中的“everyone = read”