如何在水平无序列表 () 内垂直居中列出项目 ()？

垂直对齐

垂直对齐中的元素水平

内的元素对于美观和可用性来说通常是必要的。解决办法如下：

可以使用CSS来设置

• 的行高。元素等于其高度，如下所示：

  <code class="css">li {
      height: 30px;
      line-height: 30px;
  }</code>

  在您提供的代码中：

  • 每个
  • ;高度为 100px。
  • 按钮的高度不同，为 50px（由 .button 类给出）。

  要垂直居中内容，您应该添加以下行高样式表的值：

  <code class="css">.toolbar li {
      line-height: 100px; /* For regular list items */
  }
  .toolbar li.button {
      line-height: 50px; /* For button list items */
  }</code>

  这将确保所有列表项及其内容垂直位于中间。

以上是如何在水平无序列表 () 内垂直居中列出项目 ()？的详细内容。更多信息请关注PHP中文网其他相关文章！