Semantic UI - 垂直居中一个 div

Question

10

有没有已知的方法可以使用Semantic UI的Web开发框架来居中一个<div>标签，而不需要添加自己的CSS样式？

我尝试了文档中的几个与位置相关的标签，例如<div class="centered grid'>，但这些只适用于水平居中。

这不是一种具有挑战性的实现方式，我只是惊讶于像垂直居中这样常见的功能没有包含在Web开发框架中，我很好奇我的谷歌搜索和眼睛是否忽略了它。我更喜欢遵守框架样式，而不是创建自定义样式。我知道有几种方法可以实现自己的垂直居中（在我看来这是最不理想的选项），但我更喜欢使用框架中的类。

- Nicholas Bull

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kemi · Accepted Answer

根据Semantic UI v2.2.2，您可以通过添加middle aligned类来强制垂直居中对齐。它影响以下元素：

- 表格及其行和单元格， - 网格及其行和列， - 图像， - 列表和带图像的项目， - 模态对话框内容。

您无法以这种方式将任意div元素在这些结构外设为垂直居中对齐。

否则，其他一些Semantic UI元素默认垂直居中对齐其内容。