语义UI标记图标按钮类型提交按钮

Question

我正在使用Semantic UI并尝试将图标添加到输入按钮类型提交

这是我的尝试：

<i class="sign in icon"></i>
<input type="submit" name="login-button" class="ui blue submit button" value="Login">

问题是图标显示在按钮前面而不是按钮内。

这是如何做到的，用div：

<div id="login-button" class="ui blue submit labeled icon button">
    <i class="sign in icon"></i> Login
</div>

您知道如何将图标添加到按钮类型提交。

Answer 1

<button type="submit" name="login-button" class="ui blue submit button">
  <i class="sign in icon"></i>
  Login
</button>

希望这有帮助。

W3对按钮元素有这个说法：

  

使用BUTTON元素创建的按钮功能就像使用INPUT元素创建的按钮一样，但它们提供了更丰富的渲染可能性：BUTTON元素可能包含内容。例如，包含图像的BUTTON元素的功能类似于并且可能类似于其类型设置为“image”的INPUT元素，但BUTTON元素类型允许内容。