如何设置提交按钮文本的样式

Question

我有一个样式如下的链接：

 <style>
  .addNew{
    background-color: #FFF;
    display: block;
    margin-top: 10px;
    padding: 20px;
    color: #08c;
    border:3px dashed #08c;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    font-size: 1em;
  }
</style>
    <a class='addNew'>
            <i class="fa fa-plus" ></i> Add new
            <span style='text-decoration:underline'>Object</span>
    </a>

我在文本中使用了一个 span-tag 和一个 font-awesome icon 。我如何将其用于提交按钮？我试过这个：

 <input type='submit' class='addNew' value="Add new Object">

但我不知道如何设置提交按钮文本的样式。

原文由 Adam 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

使用 按钮元素。

 <button class='addNew'>
        <i class="fa fa-plus" ></i> Add new
        <span style='text-decoration:underline'>Object</span>
</button>

…然后您可以拥有子元素并独立地针对它们进行样式设置。

原文由 Quentin 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您可以使用 <button>

 <button><i class="fa fa-plus"> Add new <span style="text-decoration:underline;">Object</span></button>

按钮行为与 <input type="button"> 或 <input type="submit"> 不同。您可以在 <button> 中附加元素。

原文由 Gaurav Aggarwal 发布，翻译遵循 CC BY-SA 3.0 许可协议