语义 UI 浮动

Question

语义 UI 新手，我在文档中找不到任何地方如何（如果可能的话）浮动一个简单的元素而不需要它是其他东西（如按钮或段）。

例如，我在页面底部有一个步骤 navigation/counter 是这样写的：

<div class="row three column">
    <div class="column">
        <br>
        <p class="ui left floated compact basic segment stepper">Step 2 of 3</p>
        <a class="ui right floated compact basic segment stepper">Go back</a>
    </div>
</div>

除了在浮动元素之前的对我来说有点奇怪之外，是否可以像 left floated 一样添加类并使它浮出水面？就像我们用 bootstrap 和 pull-left 例如……

如果我理解的好，segment就是对相关内容进行分组（语义上对应HTML5 <section>标签）。因此，在这种情况下使用 segment 似乎有点矫枉过正——如果不是语义错误的话。

Answer 1

目前 bootstrap 中没有像 pull-left 这样的全局实用程序。例如，每当在 SUI 代码中定义 right float 时，它总是与按钮、段、列表等元素关联。

您可以简单地定义自己的全局实用程序，而无需 "overkill" 任何 SUI 元素：

div [class*="left floated"] {
  float: left;
  margin-left: 0.25em;
}

div [class*="right floated"] {
  float: right;
   margin-right: 0.25em;
}

尽管对于您的情况，图标按钮在语义上可能适合这两种元素。

语义 UI 浮动

Semantic UI floats

html

semantic-ui