Fatal编程技术网

Twitter bootstrap 引导的正确代码是什么？

twitter-bootstrap css

Twitter bootstrap 引导的正确代码是什么？,twitter-bootstrap,css,Twitter Bootstrap,Css,我正试图遵循一个教程，老师让我复制下面看到的代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Bootstrap Practise</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.c

我正试图遵循一个教程，老师让我复制下面看到的代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>

<title>Bootstrap Practise</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">

</head>
<body>
<div class="Container">

<div class="row">
    <div class="col-lg-1 bg-warning">
      1
    </div>

    <div class="col-lg-1 bg-info">
      2
    </div>
    <div class="col-lg-1 bg-danger">
      3
    </div>
    <div class="col-lg-1 bg-success">
      4
    </div>
    <div class= "col-lg-1 bg-warning">
      5
    </div>
    <div class="col-lg-1 bg-info">
      6
    </div>
    <div class="col-lg-1 bg-danger">
      7
    </div>
    <div class="col-lg-1 bg-success">
      8
    </div>
    <div class="col-lg-1 bg-warning">
      9
    </div>
    <div class="col-lg-1 bg-info">
      10
    </div>
    <div class="col-lg-1 bg-danger">
      11
    </div>
    <div class="col-lg-1 bg-success">
      12
    </div>


</div>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">        </script>


<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

</body>
</html>


引导练习
1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12
我完全复制了讲师代码，当他运行它时，他在一个容器中得到12列，每边都有空白。当我运行它时，我得到12行，它们占据了整个屏幕，当我减小屏幕大小时，它们不会堆叠起来。

您需要在大屏幕上检查解决方案，或者使用col-md-x而不是col-lg-x

您的代码中有错误

将
class=“Container”
替换为
class=“Container”

我没有看到第三行。另外，如果你输入了不起作用的代码（如果你想得到关于问题这一部分的帮助的话），也会很有帮助。
bootstrap.min.css
是核心bootstrap css（需要使用bootstrap）
bootstrap theme.min.css
是一个可选的样式主题，代码适合我。我的猜测是您没有正确加载引导样式表。检查开发人员控制台，查看加载这些文件时是否出错。感谢您的帮助@Josh F我编辑了我的问题，试图使它更具体地针对我遇到的问题，我还包括了我正在使用的所有代码。我希望有人能提供一些进一步的帮助，因为这个问题真的开始困扰我了。代码在浏览器足够宽时创建列，而不是在缩小大小时创建列。基本上，如果你有一个小型设备（手机、平板电脑），你会得到一堆行，但是如果你有一个桌面，你会得到列。尝试增大浏览器屏幕的大小，看看会发生什么。伙计，你很好。几天来我一直在努力解决这个问题。饮料我请客。我现在有一个容器，（小c），两边都有空白。现在我只需要弄清楚为什么我的桌面上没有导师那样的12栏。我的浏览器是1094px宽，全宽时，我仍然可以看到12行。然而，如果我在Firefox中运行它，在响应设计M中，并将大小增加到1280，我会得到12列，但有一个水平滚动。来吧，伯纳德，二比二@暗黑破坏神通过X柱改变你的lg柱