Bootstrap表单,如何使用POST

Edw*_*rdo 13 html twitter-bootstrap twitter-bootstrap-3

我正在研究一个班级项目,我有一个网页可以搜索:http: //ada.uprrp.edu/~ehazim/hpcf_proj/basicsearch.html

这是基本代码:

<html>
<head> <title>Search HPCF Inventory</title>
</head>

<body>
    <h1> Search </h1>

    <form action="results.php" method="POST">
    Choose Search Type: <br />
    <select name="searchtype">
        <option value="ip"> IP Adress </option>
        <option value="ss_name"> Software Services </option>
        <option value="IS"> ISBN </option>
    </select>
    <br />
    Enter Search Term:<br />
    <input name="searchterm" type="text">
    <br />
    <input type="submit" value="Search">
    </form>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

现在,我希望使用bootstrap 3使其"漂亮".我想要我的网页中的确切内容,但说实话,我不了解bootstrap的形式(我是新的网页),主要是怎么说它是通过POST以及如何放置变量名称.我一直在这样的网站上寻找:http://bootsnipp.com/forms?version = 3

这看起来真的很酷,但我不明白如何编辑它...有人可以共享必要的代码,以使用bootstrap在我的网页中拥有确切的东西吗?

谢谢.

小智 15

仔细阅读并按照http://getbootstrap.com/css/#forms上的示例进行操作

所以,最终会成为

<form action="results.php" method="POST" role="form" class="form-horizontal">
  <div class="form-group">
    <label for="searchterm" class="col-sm-2 control-label">Choose Search Type</label>
    <select name="searchtype" class="form-control">
      <option value="ip"> IP Adress </option>
      <option value="ss_name"> Software Services </option>
      <option value="IS"> ISBN </option>
    </select>
  </div>
  <div class="form-group">
    <label for="searchterm" class="col-sm-2 control-label">Choose Search Term</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="searchterm" name="searchterm">
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" class="btn btn-default">Search</button>
    </div>
  </div>
</form>
Run Code Online (Sandbox Code Playgroud)