Bootstrap样式表未应用 [英] Bootstrap Stylesheet not applied

问题描述

在我的某些页面上，我包含了引导程序.

on some of my pages I have bootstrap included.

现在在一页上，我包含一个警报，该警报的样式为bootstrap.

Now on one page, I have an alert included, styled by bootstrap.

它的定义很简单:

 $('#wrongPasswordDiv').html('<br/><div class="alert alert-danger" id="wrongPWAlert" role="alert">Falsches Passwort. Bitte erneut versuchen!</div>');

此外，之前还包含Bootstrap css文件:

Also, before, Bootstrap css file is included:

<link rel="stylesheet" type="text/css" href="/bootstrapcss" />

bootstrapcss被路由到正确的CSS文件.

bootstrapcss is routed to the correct css file.

在网络"标签中，您可以看到加载引导程序工作正常:

In the network tab, you can see that loading bootstrap works fine:

但是，您也可以看到，即使正在加载，也不会应用任何类.

But also, you can see, that even though it's loading, no classes are applied.

现在，如果我将bootstrap的内容更改为CDN，则它可以正常工作，并且可以完美地应用这些类.

Now if I change the including of bootstrap to a CDN, it is working and the classes are perfectly applied.

现在我不知道问题是什么，因为如您所见，引导程序正在加载，并且在两种情况下都正在加载，但是仅当从CDN加载时，才应用样式.

Now I have no idea, what the problem is, becaue as you can see, bootstrap is loading and in both cases, it's loading, but only when loading from the CDN, the styles are applied.

有什么想法吗?

，尝试后，如果我通过直接链接而不是通过路由器加载CSS，则可以正常工作.在另一个文件中，同一行工作得很好，因此路由似乎工作得很好(事实上，您也可以看到文件也已加载)

after trying, if I load the CSS through the direct link instead of over the router, it's working. In another file, the same line is working perfectly fine though, so the routing seems to work fine (which you can see on the fact, that the file is loaded as well)

推荐答案

正如Kobi在另一个主题中所建议并回答的那样，这是对问题的答案:

As suggested and answered in another thread by Kobi, this is the answer to the question:

使用此路线:

Using this route:

$router->map('GET','/bootstrapcss','example.css','bootstrapcss'); And

然后匹配时:

then while matching:

$match = $router->match();


 if($match['name'] === 'bootstrapcss'){
    header("Content-Type: text/css");
    $fileName = $match['target'];
    echo file_get_contents($fileName);
    return; }

完整的答案是此处.

再次感谢您的帮助！

这篇关于Bootstrap样式表未应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！