Html 引导中的映像网格出现问题

我正在尝试用img circle将我制作的图像网格化为圆形图像。我想要3列和3行的图像在一个网格形成，我已经写了使用引导：

    <div class="container">
        <div class="row">
            <div class="col-md-4"> <img src="img1.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img2.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img3.png" class="img-circle"> </div>
        </div>

        <div class="row">
            <div class="col-md-4"> <img src="img4.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img5.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img6.png" class="img-circle"> </div>
        </div>

        <div class="row">
            <div class="col-md-4"> <img src="img7.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img8.png" class="img-circle"> </div>
            <div class="col-md-4"> <img src="img9.png" class="img-circle"> </div>
        </div>
    </div>

但是，当我检查它的外观时，它会导致图像垂直排列。因此，图像会转换为圆形图像，但会以直线而不是网格形式向下移动。不确定我做错了什么，或者我是否应该在CSS中做些什么

Bootstrap的col md-*有一个响应断点。如果您的设备小于该值，或者您将浏览器的大小调整为小于该值，您将看到彼此上方的图像。因此，如果您不希望网格中断，请使用列xm-*而不是列md-*。看这个片段-

.img圈{ 显示：块； 边界半径：100%； 最大宽度：100%； }

---

好的，我意识到我的问题是引导程序没有连接到我的html，因为一旦我添加了链接，它就工作了。如果我下载了bootstrap，我应该如何将它连接到我的html页面？我将bootstrap zip文件放入带有html/css代码的文件夹中，但不确定如何链接它。解压缩zip文件，然后连接bootstrap.css和bootstrap.js，就像连接外部css和js文件一样。