Html 如何使用网格在引导中设置中间和底部文本

我一直试图在这里找到解决方案，搜索等等，但似乎没有任何效果。基本上，我试图在引导程序中使用网格设置页脚，但我无法理解如何在页脚的中间高度和页脚版权类中设置类链接页脚，以便将其发送到底部。以下是想法：

我与您分享代码clean：

<footer class="page-footer">
  <div class="container-fluid text-center">
    <div class="row">
      <div class="col-4 col-footer">
        <h1>aloha name</h1>
      </div>

      <div class="col-2 link-footer">
        <a href="#" class="text-uppercase">home</a>
      </div>
      <div class="col-2 link-footer">
        <a href="#" class="text-uppercase">about me</a>
      </div>
      <div class="col-2 link-footer">
        <a href="#" class="text-uppercase">projects</a>
      </div>
      <div class="col-2 link-footer">
        <a href="#" class="text-uppercase">contact</a>
      </div>

    </div>
  </div>

  <div class="footer-copyright text-center">© 2020 Copyright:
    <span>aloha</span>
  </div>
</footer>

---

我已经尝试过添加边距、底部、py、my、my auto等，但没有任何效果。有什么想法吗？？？

你的截图没有什么帮助

但这也会起作用：

<footer class="page-footer">
    <div class="container-fluid text-center py-5" >
        <div class="row">
            <div class="col-4 col-footer">
                <h1>aloha name</h1>
            </div>

            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">home</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">about me</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">projects</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">contact</a>
            </div>

        </div>
    </div>

        <div class="footer-copyright text-center" style="margin-top: -15px; padding-bottom: 15px;">© 2020 Copyright:
            <span>aloha</span>
        </div>
</footer>

阿罗哈名字
©2020版权所有：
阿罗哈

确保将内联css添加到样式表中

页脚{
背景色：#5454；
高度：200px；
}
.col页脚h1{
文本转换：大写；
字体系列：“蒙特塞拉特”，无衬线；
字号：800；
字号：2em；
颜色：白色；
}
.链接页脚a{
字号：1em；
颜色：白色；
字号：600；
文字装饰：无；
浮动：左；
}
.文本大写{
右侧填充：2米；
}
.链接页脚a:悬停{
颜色：#4860FF；
}
.footer版权所有{
背景色：#3b3b；
颜色：#838383；
位置：固定；
左：0；
底部：0；
宽度：100%；
文本对齐：居中；
}
.footer版权范围{
颜色：白色；
}

阿罗哈名字
©2020版权所有：
阿罗哈

你是说这门课吗？我建议使用flexbox来实现这一点。您可以在这里获得基本的理解：然后使用BS4速记属性快速设置所需的类。寻求代码帮助的问题必须包含在问题本身中重现所需的最短代码，最好是在问题中。看@denkquer你建议我使用比引导网格更好的flexbox吗？这个教程看起来很不错，所以我要试试看，我要检查一下它是否有效。@D4rKNiGhT引导网格系统也使用flexbox。它只是试图从用户那里抽象出这个层。

<footer class="page-footer">
    <div class="container-fluid text-center py-5" >
        <div class="row">
            <div class="col-4 col-footer">
                <h1>aloha name</h1>
            </div>

            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">home</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">about me</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">projects</a>
            </div>
            <div class="col-2 link-footer">
                <a href="#" class="text-uppercase">contact</a>
            </div>

        </div>
    </div>

        <div class="footer-copyright text-center" style="margin-top: -15px; padding-bottom: 15px;">© 2020 Copyright:
            <span>aloha</span>
        </div>
</footer>