Question

我张贴了一个我正在做的事的例子

.open-text {
  color: pink;
  /*border: 1px solid red;*/
  /* display: flex !important; */
  /* align-items: center !important; */
  background: #1e3a87;
  font-family: 'Open Sans Condensed', sans-serif;
  /*justify-content: center;*/
}

<section>
  <h1 class="open-text">
    <br/>
    Lorem Ipsum: usage. Lorem ipsum is a pseudo-Latin text used in web design, typography, layout, and printing in place of English to emphasise design elements over content. It's also called placeholder (or filler) text.your life.
  </h1>
</section>

如何将文本放在中间并使其居中，其宽度不能占据整个页面？

Answer 1

您尝试使用display: flex的方法是可行的，只需删除<br/>（我还添加了height，以便您可以看到此居中）：

  .open-text {
        color: pink;
        display: flex;
        align-items: center;
        background: #1e3a87;
        font-family: 'Open Sans Condensed', sans-serif;
        height:200px;
    }

  <section>
    	<h1 class="open-text">
    Lorem Ipsum: usage. Lorem ipsum is a pseudo-Latin text used in web design, typography, layout, and printing in place of English to emphasise design elements over content. It's also called placeholder (or filler) text.your life.
    	</h1>
    </section>

CSS垂直对齐节标签中的文本？

1 个答案: