我的引导网格系统无法正常工作

时间:2015-10-29 07:21:48

标签: html twitter-bootstrap grid-system

我有问题将我的bootstrap网格系统应用到网页中。我应用的bootstrap是bootstrap 3.3.5,从getbootstrap.com下载。我完成了所有配置工作,这是我的项目文件目录:

file directory

这是我的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垂直布局。我做错了吗?

1 个答案:

答案 0 :(得分:0)

好吧,最后我发现导致问题的标点符号!我应该更加小心,并且我们应该注意很多事情,例如:

jquery 顺序 bootstrap css 脚本要说明。

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

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

④无论如何更加小心更好。