我正在使用Bootstrap 4.3 Spinner,一切正常,但是我想在Spinner下添加其他文本。这是我的HTML



<div class="d-flex justify-content-center">
       <div class="row">
           <div class="spinner-border" role="status">
               <span class="sr-only">Loading...</span>
            </div>
         </div>
        <div class="row">
            <strong>Collecting data</strong>
        </div>

    </div>





但是文本“收集数据”附加在微调框上,我该如何解决?

最佳答案

将这两个类添加到容器div中:

flex-column align-items-center


flex-column使flexbox垂直堆叠,而align-items-center将项目在新轴上居中。



<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="d-flex flex-column align-items-center justify-content-center">
   <div class="row">
       <div class="spinner-border" role="status">
           <span class="sr-only">Loading...</span>
       </div>
    </div>
    <div class="row">
      <strong>Collecting data</strong>
    </div>
</div>

关于css - 将文本置于微调 bootstrap 下,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55528321/

10-12 12:20
查看更多