简体   繁体   English

skel.js框架/ HTML5UP模板CSS问题

[英]skel.js Framework / HTML5UP Template CSS issues

I'm new to the skel.js framework and I'm having some issues. 我是skel.js框架的新手,我遇到了一些问题。

I downloaded a template from HTML5UP.net (Zerofour theme) and I have modified it all for my site however the CSS doesn't show up properly on my no-sidebar & left-sidebar pages. 我从HTML5UP.net(Zerofour主题)下载了一个模板,我已经为我的网站修改了所有模板,但CSS没有在我的无边左侧边栏页面上正确显示。

I have an include with the follwing links (identical to their templates): 我有一个包含以下链接(与他们的模板相同):

    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800"         rel="stylesheet" type="text/css" />

    <script src="http://www.**********.com/js/jquery.min.js"></script>
    <script src="http://www.**********.com/js/jquery.dropotron.js"></script>
    <script src="http://www.**********.com/js/config.js"></script>
    <script src="http://www.**********.com/js/skel.min.js"></script>
    <script src="http://www.**********.com/js/skel-panels.min.js"></script>

    <noscript>
        <link rel="stylesheet" href="http://www.*********.com/css/skel-noscript.css" />
        <link rel="stylesheet" href="http://www.*********.com/css/style.css" />
        <link rel="stylesheet" href="http://www.*********.com/css/style-desktop.css" />
    </noscript> 

If I bypass the noscript the webpage appears as it should but loses ALL mobile and flowable capabilites. 如果我绕过noscript,网页就会出现,但会丢失所有移动和可流动的功能。

Any ideas would be much appreciated! 任何想法将不胜感激!

Addon : If I move my pages to the root directory and update the links then the CSS works but in their child directories only the basic layout works. 插件 :如果我将页面移动到根目录并更新链接,那么CSS可以工作,但在他们的子目录中只有基本布局有效。

    <?php
    define(currentDIR,'../');
    include (currentDIR.'includes/_functions.php');
    ?>
    <html>
<head>
    <?php include(currentDIR.'includes/_metalinks.php'); ?> //This is where the code above is stored
</head>

I also came across this issue while using an HTML5up template with Django. 我在使用Django的HTML5up模板时遇到了这个问题。 If you are using a different directory configuration for your static files, you must specify this in either the init.js or config.js file (the exact file depends on which template you are using and how recently it has been updated). 如果要对静态文件使用不同的目录配置,则必须在init.js或config.js文件中指定它(确切的文件取决于您使用的模板以及最近更新的模板)。 For me, I had to modify the following skelJS prefix in the init.js file: 对我来说,我必须在init.js文件中修改以下skelJS前缀:

    var helios_settings = {
        // other settings here

        skelJS: {prefix: '/static/css/style',

        // other settings here
        }

Basically, this directory prefix needs to match wherever you have your static files. 基本上,此目录前缀需要匹配静态文件的任何位置。

我想你忘了添加

        <link rel="stylesheet" href="css/style-noscript.css" />

I ran into the same issue and was able to fix it by modifying the config.js file to use the absolute path as follows: 我遇到了同样的问题,并且能够通过修改config.js文件来修复它,使用绝对路径,如下所示:

prefix: '/css/style',

Now files in both the root and other directories maintain the styling throughout. 现在,根目录和其他目录中的文件始终保持样式。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM