详细信息标签文本不响应 CSS 边距答案

【问题标题】：Details tag text doesn't respond to css margin详细信息标签文本不响应 CSS 边距
【发布时间】：2021-08-20 17:30:43
【问题描述】：

无论我尝试什么，添加详细信息标签的文本都不会尊重margin-left 样式。

部分 html 文本不起作用

p1 {
  text-align: center;
  color: silver;
  font-size: 100%;
  font-family: "Times New Roman", Times, serif;
}

p2 {
  margin-left: ;
  text-align: left;
  color: silver;
  font-size: 100%;
  font-family: "Times New Roman", Times, serif;
}

details,
summary {
  margin-left: 20%;
  color: silver;
  font-size: 110%;
  font-family: "Times New Roman", Times, serif;
}

<main>
  <p> Below are some of the most improtant, or amusing, characters in the Skyrim game. A brief description of the charcter and a quote they made or one referenceing them is also mporvided under their name. They are arranged in alphabetical order, not in order
    of significance. Some information is omitted to prevent spoiling important events in the game or because the information changes depending on the choices that you make. </p>

  <details>
    <summary> Alduin </summary>
    <p1> "Bahloki nahkip sillesejoor (My hunger will be fed by mortal souls). My belly is full of the souls of your fellow mortals, Dovahkiin. Die now and await your fate in Sovngarde!" -Alduin <br> </p1>
    <p2> You the character. Your personal `enter code here`identity, which is shaped by how you interact with the world `enter code here`around you. </p2>
  </details>

结果如何

【问题讨论】：

你为什么用p1和p2，它们不是html标签。如果要为每个 p 应用不同的样式，可以使用 class 属性。我会说你不需要为summary 应用任何边距，如果你只为details 应用它是可以的，因为它里面有摘要。
您的代码在这里运行良好
如果你能说明你打算它是如何出现的，那么我们就会了解目标。

标签： html css margin details-tag

【解决方案1】：

您需要在代码中正确设置 CSS 样式才能显示“margin-left”声明值。使用 '.details' 选择器而不是 'details' 并在 HTML 元素中添加 class 属性。检查代码

.p1 {
  margin-left: 50px;
  text-align: center;
  color: silver;
  font-size: 100%;
  font-family: "Times New Roman", Times, serif;
}

.p2 {
  margin-left: 50px;
  text-align: left;
  color: silver;
  font-size: 100%;
  font-family: "Times New Roman", Times, serif;
}

.details,
.summary {
  margin-left: 50px;
  color: silver;
  font-size: 110%;
  font-family: "Times New Roman", Times, serif;
}

<main>
  <p>
    Below are some of the most improtant, or amusing, characters in the Skyrim game. A brief description of the charcter and a quote they made or one referenceing them is also mporvided under their name. They are arranged in alphabetical order, not in order
    of significance. Some information is omitted to prevent spoiling important events in the game or because the information changes depending on the choices that you make.
  </p><br />

  <details class="details">
    <summary class="summary"> Alduin </summary>
    <p class="p1"> "Bahloki nahkip sillesejoor (My hunger will be fed by mortal souls). My belly is full of the souls of your fellow mortals, Dovahkiin. Die now and await your fate in Sovngarde!" -Alduin <br> /</p>
    <p class="p2"> You the character. Your personal `enter code here`identity, which is shaped by how you interact with the world `enter code here`around you. </p>
  </details>
</main>

【讨论】：