每一排内容的水平的对齐方式我们也可以去设置一下 .. 现在这里有一排内容 .. 里面分成了两栏 .. 每一栏会占用 4 个网格的宽度 ..

现在整排内容会靠左边显示 .. 打开开发者工具 .. 选中这个 row 元素 ..

然后在这个 row 容器的上面，添加一个 justify-content-start .. 这个是元素默认的水平的对齐方式 .. 再换成 justify-content-center .. 这样这排内容会水平居中显示 .. 注意这个 justfiy-content-center 这个类的样式，里面用了 flexbox 的 justify-content 属性，对应的值是 center ..

水平靠右显示，可以用一下 justify-content-end .. 这个类上面的样式就是把 justify-content 设置成了 flex-end

这个 row 里面现在有两栏内容，每栏占用四个网格的宽度，剩下的空间如果想放在这两栏内容的中间，可以在这个 row 元素上用一个 justify-content-between ..

这个类里面就是把 justify-content 设置成了 space-between ..

想把剩余空间平均分配到这两栏内容的周围，可以用一下 justify-content-around .. 它就是把 justify-content 的值设置成了 space-around ..

水平还有垂直的对齐方式也可以组合到一块儿去用，比如我想让这两栏内容在这个 row 里面水平垂直都居中，添加一个 justify-content-center 让它水平居中，再添加一个 align-items-center ，它会让 row 容器里面的元素垂直居中 ..