<div class="text"> <p>科技内容</p> <p class="fontSet"> Technological content</p> </div>如何让其中p标签两行文本居中
时间: 2023-12-03 19:45:05 浏览: 53
可以使用以下 CSS 样式来实现:
```
.text {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.fontSet {
margin-top: 10px; /* 可根据需要调整上下间距 */
}
```
这里使用了 flex 布局来实现让两行文本居中。`display: flex` 表示将 `.text` 元素设置为 flex 布局,`flex-direction: column` 表示让子元素垂直排列,`align-items: center` 表示让子元素在垂直方向上居中对齐,`text-align: center` 表示让子元素在水平方向上居中对齐。
同时,为了让两行文本在垂直方向上居中,我们还需要为第二个 p 标签(`.fontSet`)添加一个上边距(`margin-top`)。
阅读全文