css - 推特 Bootstrap : using submit form as drop down menu items?

Question

我不想在下拉菜单中使用 anchor 或按钮，而是希望每个元素都有一个表单。该表单包含一些隐藏字段和一个提交按钮。当我将表格放入每个 <li> 时在我的标记中，UI 被搞砸了。 Bootstrap 本身支持这个吗？如果没有，我将重新编码我的应用程序以使用链接。

更新 1:屏幕截图

更新 2:标记

  <div class="btn-group open">
    <button class="btn">Action</button>

    <ul class="dropdown-menu">
      <li>
        <form action="#" method="post">
          <fieldset>
            <input type="submit" value="Favorite"/>
          </fieldset>
        </form>
      </li>

      <li><a href="#">Message</a></li>

      <li>
        <form action="#" method="post">
          <fieldset>
            <input type="submit" value="Smile"/>
          </fieldset>
        </form>
      </li>

      <li>
        <form action="#" method="post">
          <fieldset>
            <input type="submit" value="Block"/>
          </fieldset>
        </form>
      </li>

      <li>
        <form action="#" method="post">
          <fieldset>
            <input type="submit" value="Friend"/>
          </fieldset>
        </form>
      </li>

      <li>
        <form action="#" method="post">
          <fieldset>
            <input type="submit" value="Exclude From Future Search Results"/>
          </fieldset>
        </form>
      </li>
    </ul>
  </div>

更新 3:图标

我希望提交按钮有一个图标。不确定最好的方法是什么，但这是我的解决方案:

<label for="foo">
   <i class="icon-ok></i> Favorite
</label>
<input id="foo" style="display:none;" type="submit" value="Favorite"/>

提交表单被隐藏，标签以图标显示，当用户点击标签时，它起作用了。无需 JS。

Answer 1

不太确定我是否理解您关于隐藏提交表单但显示图标的标签的意思，但是我能够用图像覆盖按钮。请参阅附件中的 jsBin。我通过在输入中添加一个类来做到这一点

http://jsbin.com/eboqij/1/edit

.button{
background-image:url('http://www.nyanicorn.com/res/img/icon_nyan.png');
    background-repeat:no-repeat;
text-indent:-9999px;
  width:40px!important;

}