我的引导网格系统不工作答案

【问题标题】：My bootstrap grid system not working我的引导网格系统不工作
【发布时间】：2015-10-29 07:21:47
【问题描述】：

我在将引导网格系统应用到网页时遇到问题。我应用的bootstrap是bootstrap 3.3.5，从getbootstrap.com下载的。我已经完成了所有的配置工作，这是我的项目文件目录：

这是我的 index.html 结构：

<html>
<head>
    <title>My bootstrap</title>

    <meta charset="utf-8”>
    <meta name="viewport” content="width=‘device-width’,inital-scale=1.0”>

    <link href="css/bootstrap.min.css” rel="stylesheet”>
    <link href="css/custom.css” rel="stylesheet”>

    <script src="/js/respond.min.js”></script>
</head>

<body>
    <div class="container">
        <div class="row">
            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                <p>text</p>
            </div>

            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                <p>text</p>
            </div>

            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                <p>text</p>
            </div>

            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                <p>text</p>
            </div>
        </div>

        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
    </div>
</body>
</html>

但是，当浏览器大小改变时，网格系统无法正常工作，它始终保持原始样式，即垂直 4 div 布局。我做错了吗？

【问题讨论】：

标签： html twitter-bootstrap grid-system

【解决方案1】：

嗯，最后我发现是标点符号导致了问题！我应该更加小心，还有很多我们应该注意的事情，比如：

① jquery 和 bootstrap css 脚本的 order 状态。

②你应该知道一行等于12列，所以不要滥用你的行类。

③ 有时你应该检查你的 chrome extensions，它可能会禁止你加载本地 .js 文件。

④反正越小心越好。

【讨论】：

这几乎给出了我会给出的相同答案。除了带有行的第二部分。当然，一行等于 12 列，但是如果您按照问题中使用的方式使用它，它不会导致任何问题。只要在每个视口中有 12 列值，如果超过，请确保删除列也这样做。