html - 如何在 中居中

Question

嘿，我想让一个文本对齐，但在文本的顶部我想要另一个文本，但在中心，在 span 标签内。代码在下面

html:

<p><span>Hello world,</span>Here is my long text, about 100 lines</p> <!-- This must be justified-->

CSS:

p {
    text-align: justify;
}

span {
    text-align: center;
}

Answer 1

您需要将 span 元素设置为 display: block; 以便 text-align: center; 规则你已在此元素上声明以实现您期望的效果。

span {
  display: block;
  text-align: center;
}

p {
  text-align: justify;
}

<p><span>Hello world,</span>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

最好将 span 更改为 p，因为它已经是 block 元素，然后您可以针对相应的 p分别标记并相应地应用所需的 text-align 规则。