【发布时间】:2021-09-16 18:10:48
【问题描述】:
我怎样才能确定我的<p class="title"></p> 和
<p class="subtitle"></p> 显示在彼此下方,因为现在它们正在彼此旁边显示
【问题讨论】:
-
你已经有一些 CSS 了吗?你能在这里分享吗?如果你写了两个
p标签,第二个已经换行了。
我怎样才能确定我的<p class="title"></p> 和
<p class="subtitle"></p> 显示在彼此下方,因为现在它们正在彼此旁边显示
【问题讨论】:
p 标签,第二个已经换行了。
你可以使用flexbox,一定能解决你的问题。
示例
如果你想安排两个相互底层的项目:
.container {
display: flex;
flex-direction: column;
}
<div class="container">
<p class="title">Hello</p>
<p class="subtitle">World</p>
</div>
如果您想将两个项目并排排列。
.container {
display: flex; /*by default it will align items in one row*/
}
<div class="container">
<p class="title">Hello</p>
<p class="subtitle">World</p>
</div>
【讨论】:
<p>标签是块级元素,所以总是从新行开始