Twitter bootstrap 使用bootstrap的水平表单

Twitter bootstrap 使用bootstrap的水平表单,twitter-bootstrap,Twitter Bootstrap,嗨,我正在尝试使用twitters引导实现一个水平表单,但由于某些原因,标签一直显示为块级项目,而不是浮动在文本框的左侧。我的代码在下面,任何人都可以帮助我 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <met

嗨,我正在尝试使用twitters引导实现一个水平表单,但由于某些原因,标签一直显示为块级项目,而不是浮动在文本框的左侧。我的代码在下面,任何人都可以帮助我

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
    <title></title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <!-- Optional theme -->
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css">
    <!-- Latest compiled and minified JavaScript -->

    <script src="/Scripts/jquery-2.0.3.min.js"></script>
    <script src="/Scripts/bootstrap.js"></script>
    <script src="/js/prettyPhoto/jquery.prettyPhoto.js" type="text/javascript"></script>
    <script src="/js/document.ready.js" type="text/javascript"></script>
    <link href="/js/prettyPhoto/prettyPhoto.css" rel="stylesheet" type="text/css">
    <link href="/css/loggedin.css" rel="stylesheet" type="text/css">
</head>
<body screen_capture_injected="true">
    <form method="post" action="feedback.aspx" id="form1" class="form-horizontal">
        <div class="container">
            <div class="row">
                <h1>Feedback &amp; comments</h1>
                <div class="row">
                    <p>Please use the form below to give us your feedback, comments, and suggestions to improve the site.</p>
                    <fieldset>
                        <legend>Feedback</legend>
                        <div class="control-group">
                            <label class="control-label" for="MainBodyContent_TxtEmail">Email</label>
                            <div class="controls">
                                <input name="ctl00$MainBodyContent$TxtEmail" type="text" value="" id="MainBodyContent_TxtEmail" class="input-xlarge" placeholder="Email">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="MainBodyContent_TxtEmail">Name</label>
                            <div class="controls">
                                <input name="ctl00$MainBodyContent$TxtName" type="text" id="MainBodyContent_TxtName" class="input-xlarge" placeholder="Name">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="MainBodyContent_TxtEmail">Comments</label>
                            <div class="controls">
                                <textarea name="ctl00$MainBodyContent$TxtComments" rows="2" cols="20" id="MainBodyContent_TxtComments" class="input-xlarge" placeholder="Comments"></textarea>

                            </div>
                        </div>
                        <input type="submit" name="ctl00$MainBodyContent$SendFeedback" value="Send" id="MainBodyContent_SendFeedback" class="btn">
                    </fieldset>
                </div>
            </div>
        </div>
    </form>
</body>
</html>

反馈及;评论
请使用下表向我们提供您的反馈、意见和建议,以改进网站

反馈 电子邮件 名称 评论
您必须使用列,您可以在中看到一个示例(向下滚动到水平形式)

代码示例:

<form class="form-horizontal" role="form">
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
    <div class="col-sm-10">
      <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
    </div>
  </div>
</form>

电子邮件

谢谢,我正在读O'Reilly关于bootstrap的书,书中没有提到这一点,但效果非常好。如果这对您有帮助,请投票并将其标记为解决方案!