Question

我想知道是否有人可以帮助在正文中关于页面的文本中心，而不改变动态页面高度计算。

这里是jade / pug代码

 section.container-fluid
            .row(style="padding-top:20px;").centered-form.center-block
                section.container(style="display: flex; align-items: center; justify-content: center;").col-md-10.text-center
                    .wb-stl-normal(style="margin: auto; align-self: center;")
                        p
                            em TEXT
                            |  TEXT TEXT
                            br
                            span.wb-stl-small TEXT TEXT
                        br

我尝试了不同的方法，无法实现任何可见的结果，这将有助于我将文本置于块“section.container-fluid”的中间，以便在页面画布中完美对齐H / V.

Answer 1

您可以使用bootstrap flex-box类

水平对齐

.d-flex .align-content-{x}其中“x”可以是center，around或between

垂直对齐

.d-flex .align-items-{x}其中“x”可以是center，stretch或baseline

引用flexstbox类here

您可以详细了解css flex-box here

flexbox中的中心文本，它是bootstrap行的子容器

1 个答案: