html - Bootstrap 容器中的对齐问题

Question

我目前正在使用 bootstrap 4 构建我的第一个网站，我有一些一般性问题，要么我找不到很好的答案，要么想知道如何处理某些事情......这里是:

1. 在整个网站中使用多种容器样式是否很常见？我的意思是在一个地方有一个“容器”而在其他地方有一个“容器流体”是完全可以的吗？

2. 此外，我还制作了一些非常小的东西，看看效果如何。 Boostrap 提供了一个名为“text-md-right”的类，据我所知，它应该右对齐文本。让我展示我的示例代码。为什么我的“bg-success”中的文本没有右对齐？

    <div class="container-fluid">
    <div class="row">  
    <div class="col-md-3" style="min-height: 0.5rem; background-color: #FBB040"></div>
    <div class="col-md-3" style="min-height: 0.5rem; background-color: #939598"> </div>
    <div class="col-md-3" style="min-height: 0.5rem; background-color: #D1D3D4"> </div>
    <div class="col-md-3" style="min-height: 0.5rem; background-color: #28AB9E"> </div>
    </div>
    <div id="outter-div" class="row">
    <div id="inner-div-1-logo" class="col-md-3 test"><img src="images/logo.png" class="mx-auto d-block" alt="helloworld" style="width:200px"></div>
    <div id="inner-div-1" class="col-md-8">
        <div class="row contact-bar text-md-right bg-success"> hello world -- needs to be right-aligned</div>
        <!--<div id="contact-bar" class="row bg-success contact-bar"> Call Us @ (888) 888-8888 | info@email.com |  <a href="http://www.google.com"> Customer Portal </a> </div> -->
    <div id="nav-bar" class="row nav-bar bg-primary"> nav-bar </div>
    </div>
    </div>           
    </div>

1. 我很想听听一些关于我根据上面的代码构建它所采用的方法的反馈。我在这里朝着正确的方向前进吗？你会做些不同的事情吗？

谢谢。

Answer 1

请使用以下链接阅读有关网格系统规则的信息。 访问https://www.w3schools.com/bootstrap/bootstrap_grid_system.asp 阅读规则后，您可以开始使用下面链接中给出的示例构建自己的 Html 页面 https://getbootstrap.com/docs/4.0/examples/