HTML 边框放置

Question

我是 Html 的新手，正在尝试将列表中的元素放入框中。然而，在尝试使用样式类而不是为每个元素硬写样式类时，文本不再放置在框中。此问题也仅在我将文本居中时出现，这是一项要求。 鉴于它只是一个小文件，我已将整个代码粘贴到问题中。

.EventBorder {
  border: 3px;
  border-style: solid;
  border-color: #287EC7;
  padding: 2em;
}

<h1>
  <center>Itineree</center>
</h1>
<h2>
  <center>~ <i>Plan Your Brisbane Event Schedule</i> ~</center>
</h2>

<h4>
  <center>Below is a Visual Itinerary of the Events you have Selected</center>
</h4>

<p class="EventBorder">
  <center>Event 1: This is List Option 1</center>
</p>
<p class="EventBorder">
  <center>Event 2: This is List Option 2</center>
</p>
<p class="EventBorder">
  <center>Event 3: This is List Option 3</center>
</p>
</ul>

我只想要边框内的文本。

Answer 1

如果你有used a validator，你的问题就会暴露出来.

<center>元素(在 1996 年被 CSS 取代)不能是 <p> 的子元素元素。

因此，<center>开始标记隐式结束 <p>元素，因此它和其中的文本不在 <p> 中因此在它的边界之外。