如何在jumbotron中设置<h1>和<p>的位置？

<div class="jumbotron">
  <h1>Title</h1>
  <p>Content</p>
</div>

<style>
.jumbotron {
  display: flex;
  flex-direction: column;
}

h1 {
  flex: 1;
}

p {
  flex: 2;
}
</style>

<div class="jumbotron">
  <h1>Title</h1>
  <p>Content</p>
</div>

<style>
.jumbotron {
  position: relative;
}

h1 {
  position: absolute;
  top: 50px;
  left: 50px;
}

p {
  position: absolute;
  top: 100px;
  left: 50px;
}
</style>