我需要使用引导程序创建html页面，因为我无法创建此<div>。这些<div>也必须具有响应性。要创建的div 的图像
<div class="row">
<div class="bord2 col-md-4">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>
<div class="bord col-md-4">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>
<div class="bord col-md-4">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>把你的代码放在容器里：
<div class="container">
...your code...
</div>
为了使其响应式添加所有引导类，如下所示col-lg-4 col-md-4 col-sm-4 col-xs-4。 这些是引导程序中用于响应能力的类。 LG表示大型台式机md是指平板电脑屏幕尺寸以及小型和Xtra小型移动屏幕的XS和SM。
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="bord2 col-lg-3 col-md-3 col-sm-4 col-xs-3" style="background-color:green">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>
<div class="bord col-lg-3 col-lg-offset-1 col-md-3 col-md-offset-1 col-sm-3 col-sm-offset-1 col-xs-3 col-xs-offset-1" style="background-color:blue">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>
<div class="bord col-lg-3 col-lg-offset-1 col-md-3 col-md-offset-1 col-sm-3 col-sm-offset-1 col-xs-3 col-xs-offset-1" style="background-color:grey">
<h4 class="grey card-title">ABCD</h4>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
</div>
</div>
</body>
</html>当您开始使用引导程序时，我建议您完成本教程