Question

我正在开发一个asp.net mvc应用程序，我使用this模板作为我的应用程序。对于js和css资源，我使用URL.Content帮助方法，但问题是模板引用的css资源仅在home / index操作中加载，当我转到其他操作时，浏览器控制台说它无法找到资源。 / p>

以下是我在_layout.cshtml中的内容：

<script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/js/config.js")"></script>
<script src="@Url.Content("~/js/skel.min.js")"></script>
<script src="@Url.Content("~/js/skel-panels.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

<noscript>
    <link rel="stylesheet" href="@Url.Content("~/css/skel-noscript.css")"/>
    <link rel="stylesheet" href="@Url.Content("~/css/style.css")" />
    <link rel="stylesheet" href="@Url.Content("~/css/style-desktop.css")" />
</noscript>

以下是我在chrome Element标签中可以看到的内容：

<script src="/Scripts/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="/js/config.js"></script>
<script src="/js/skel.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/style-desktop.css">
<script src="/js/skel-panels.min.js"></script>
<style type="text/css"></style>
<script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
<noscript>

        &lt;link rel="stylesheet" href="/css/skel-noscript.css"/&gt;
        &lt;link rel="stylesheet" href="/css/style.css" /&gt;
        &lt;link rel="stylesheet" href="/css/style-desktop.css" /&gt;
    </noscript>

这是我在broswer中从控制台获得的错误：

GET http:///myapp/test/css/style-desktop.css 404 (Not Found) skel.min.js:1
GET http://myapp/test/css/style.css 404 (Not Found) skel.min.js:1

Answer 1

您所要做的就是在“_skel_config”obj中设置“前缀”。走向风格的正确道路。

window._skel_config = {
    prefix: 'css/style',
};

Answer 2

Alaasdk是对的，大多数使用skelJS的类似模板都带有这样的东西：

window._skel_config = {
    prefix: '/css/style'
}

在他们的js / config.js文件中。因此，如果你有控制器来处理这样的URL：

domain/users/10
domain/category/subcategory/article-slug

或类似的，您只需将其设置为相对URL，如

prefix: '/css/style'

Answer 3

您在代码段中的样式表链接位于<noscript>块中，仅适用于已关闭javascript的用户。

在@ marcus33cz和@alaasdk指出，你在config.js中设置相对路径。

在最新版本的skel中，你可以在init.js中设置它：

global: { href: '/css/style.css', containers: 1400, grid: { gutters: ['2em', 0] } },
desktop: { media: '(max-width: 1680px)', href: '/css/style-desktop.css', containers: 1200 },
// and so on for all of your stylesheets

与skel.js和asp.net mvc相关内容的resposive模板

3 个答案: