时间戳

首页 > 解决方案 > CSS垂直对齐部分标签中的文本？

javascript - CSS垂直对齐部分标签中的文本？

问题描述

我发布了一个我正在做的例子

.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>

如何将文本放在中心并使其成为一个居中的列，其宽度不会占据整个页面？

标签： javascriptcssnode.js

解决方案

您对作品的尝试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>

推荐阅读