使两个 HTML 按钮并排显示答案

【问题标题】：Making two HTML buttons go side by side使两个 HTML 按钮并排显示
【发布时间】：2012-07-14 06:30:30
【问题描述】：

好吧，我不太熟悉 HTML，或者它如何与 CSS 结合在一起。我一直在研究如何让两个 HTML 按钮并排显示。这是我目前正在使用的代码。

<FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
  <input type="submit" value="Forum Home Page">
</FORM>
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
  <input type="submit" value="Skill Guides">
</FORM>

无论我是把它们放在一个之后还是在它们前面放置一个对齐。我似乎无法让他们挨着走。我希望有人可以轻松详细地帮助我。

【问题讨论】：

为什么要使用表单？你可以让javascript为你做这件事
当您真正想要链接时，为什么要使用表单或 JavaScript？如果您愿意，您可以随时将链接设置为按钮样式。

标签： html button

【解决方案1】：

如果我理解正确，您可以附上以下 CSS：

form {
    display: inline;
}

如图所示：http://jsfiddle.net/zcz3j/

【讨论】：

好吧，我将如何实现它？就在两个 FORM 标签之后？

【解决方案2】：

演示http://jsfiddle.net/satinder_singh1/wr4Xv/1/

<div id="main">
<div class="floatdiv"><FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
  <input type="submit" value="Forum Home Page">
</FORM></div>
<div class="floatdiv">
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
  <input type="submit" value="Skill Guides">
    </FORM></div></div>

<style type="text/css">
    #main
    {
    position:relative;
        width:200px;
    }

    .floatdiv
    {
    float:left;
        width=80px
    }
</style>

【讨论】：

正如我所说，我仍然不太了解 HTML 和 CSS 是如何组合在一起的。请考虑。

【解决方案3】：

您也可以尝试将它们包装在表格标签中。这就是我解决类似问题的方法。表格会自动将它们并排放置。

【讨论】：