与标题堆叠的文字

Question

我尝试用 html 制作索引并用 php 语言为我的网站编写代码，但文本总是堆叠在一起或在标题旁边，我不知道如何在标题下制作它。

这是代码：

<div class="Materi_1">
  <div class="main">
    <h2><span><strong>Kesebangunan dan Rumus Trigonometri Dasar</strong></span></h2> 
    <br>
    <br>   
  </div> 
  Dua segitiga meskipun sisinya berbeda panjang mungkin sebangun. 
  <br> Coba deh cek dua segitiga berbeda di bawah ini, 
  <br> diperhatikan juga hasil perbandingannya.
</div>

Answer 1

要使文本显示在标题下方，您可以将文本包装在一个单独的 HTML 元素中，并应用 CSS 对其进行相应定位。

<div class="Materi_1">
    <div class="main">
        <h2><span><strong>Kesebangunan dan Rumus Trigonometri Dasar</strong></span></h2> 
        <div class="content"> <!-- Wrap the text inside a separate div -->
            <p>Dua segitiga meskipun sisinya berbeda panjang mungkin sebangun. </p>
            <p>Coba deh cek dua segitiga berbeda di bawah ini, </p>
            <p>diperhatikan juga hasil perbandingannya.</p>
        </div>
    </div> 
</div>

然后你可以为类“内容”添加CSS

.Materi_1 .main {
position: relative;
}

.Materi_1 .main .content {
position: absolute;
top: 100%;
left: 0;
margin-top: 10px; 
}