如何使用CSS使HTML中的<p>元素内容垂直居中于块级元素（盒子模型）内部？

要让HTML中的 `<p>` 元素内容垂直居中于块级元素内，你可以采用以下几种方法：

1. **Flexbox**:
如果容器是 Flex 容器，可以使用 `display: flex;` 和 `align-items: center;` 来使其内容垂直居中。例如：

   .container {
     display: flex;
     justify-content: center;
     align-items: center;
   }

然后将 `<p>` 元素放在 `.container` 中。

2. **Grid**:
使用 CSS Grid 可以同样实现这个效果。给容器设置 `display: grid;`，并调整 `align-items` 属性：

   .container {
     display: grid;
     place-items: center;
   }

3. **定位（Positioning）+ 绝对/相对定位**:
对 `.container` 设置 `position: relative;` 或 `position: absolute;`，然后对 `<p>` 设置 `position: absolute; top: 50%; transform: translateY(-50%);`：

   .container {
     position: relative;
   }
   p {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
   }

4. **CSS Table 模型**:
将容器样式设置为 `display: table-cell; vertical-align: middle;`：

   .container {
     display: table-cell;
     vertical-align: middle;
   }

请注意选择哪种方法取决于具体的布局需求和兼容性要求。