Css 无表情响应栏-韩元'；无法在平板电脑上调整大小

我使用的是unsemantic网格布局，但是，通过以下代码，我希望bodydiv在分辨率在平板电脑范围内时能够调整到100%：

<div class="grid-parent tablet-grid-100 grid-80" id="body">
    <div class="grid-100" id="search-result">
        search return
    </div>  
    <div class="grid-50" id="column-left">Column left</div>
    <div class="grid-50" id="column-right">Column right</div>
</div>

搜索返回
左栏
右栏

但是，在达到移动大小（默认为100%）之前，它将保持在80%。我已包括以下css文件：

<link rel="stylesheet" href="./assets/stylesheets/demo.css" />
<link rel="stylesheet" href="./assets/stylesheets/dan.css" />
<link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-base.css" />
<link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-responsive-tablet.css" />
    <noscript>
        <link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-mobile.css" />
    </noscript>
    <script>
      var ADAPT_CONFIG = {
        path: './assets/stylesheets/',
        dynamic: true,
        range: [
          '0 to 767px = unsemantic-grid-mobile.css',
          '767px = unsemantic-grid-desktop.css'
        ]
      };
    </script>
    <script src="./assets/javascripts/adapt.min.js"></script>

变量自适应_配置={
路径：'./资产/样式表/'，
动态：是的，
范围：[
“0到767px=unsentic grid mobile.css”，
'767px=unsentic grid desktop.css'
]
};

---

我真的不明白为什么它不起作用

似乎你必须通过adapt调用unsentic-grid-table.css，而不是通过link调用unsentic-grid-responsive-table.css。请尝试以下代码：

<link rel="stylesheet" href="./assets/stylesheets/demo.css" />
<link rel="stylesheet" href="./assets/stylesheets/dan.css" />
<link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-base.css" />
    <noscript>
        <link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-mobile.css" />
    </noscript>
    <script>
      var ADAPT_CONFIG = {
        path: './assets/stylesheets/',
        dynamic: true,
        range: [
          '0 to 767px = unsemantic-grid-mobile.css',
          '767px to 1025px = unsemantic-grid-tablet.css',
          '1025px = unsemantic-grid-desktop.css'
        ]
      };
    </script>
    <script src="./assets/javascripts/adapt.min.js"></script>

变量自适应_配置={
路径：'./资产/样式表/'，
动态：是的，
范围：[
“0到767px=unsentic grid mobile.css”，
'767px到1025px=不可扫描的网格tablet.css'，
'1025px=unsentic grid desktop.css'
]
};

要将Unsemantic与Adapt.js一起使用，以满足您的平板电脑断点使用情况：

• 最初只加载基本CSS
• 如果JavaScript被禁用或不可用，则使用tablet断点加载响应CSS
• 在HTML文档的头部配置并加载Adept.js
• 如果您只想使用80%的宽度作为桌面默认值（网格-80），那么您可能还想利用前缀-10来保持布局居中

我能够成功地测试以下各项：

<link rel="stylesheet" href="./assets/stylesheets/demo.css">
<link rel="stylesheet" href="./assets/stylesheets/dan.css">
<link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-base.css">
<noscript>
    <link rel="stylesheet" href="./assets/stylesheets/unsemantic-grid-responsive-tablet.css">
</noscript>
<script>
    var ADAPT_CONFIG = {
        path: './assets/stylesheets/',
        dynamic: true,
        range: [
            '0 to 767px = unsemantic-grid-mobile.css',
            '767px to 1025px = unsemantic-grid-tablet.css',
            '1025px = unsemantic-grid-desktop.css'
        ]
    };
</script>
<script src="./assets/javascripts/adapt.min.js"></script>

变量自适应_配置={
路径：'./资产/样式表/'，
动态：是的，
范围：[
“0到767px=unsentic grid mobile.css”，
'767px到1025px=不可扫描的网格tablet.css'，
'1025px=unsentic grid desktop.css'
]
};

正文：

搜索返回
左栏
右栏

很抱歉，这是一个麻烦，不能回答您的问题，但为什么不将您的手机和桌面CSS包含在一个文件中，并使用@media功能应用它们呢。这样就避免了加载另一个JS文件并运行脚本，这大大弥补了文件大小的小幅度增加。

<div class="grid-parent grid-80 prefix-10 tablet-grid-100" id="body">
    <div class="grid-100" id="search-result">
        search return
    </div>  
    <div class="grid-50" id="column-left">column left</div>
    <div class="grid-50" id="column-right">column right</div>
</div>