Twitter bootstrap 使用bootstrap的水平表单
嗨,我正在尝试使用twitters引导实现一个水平表单,但由于某些原因,标签一直显示为块级项目,而不是浮动在文本框的左侧。我的代码在下面,任何人都可以帮助我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
<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 & 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的书,书中没有提到这一点,但效果非常好。如果这对您有帮助,请投票并将其标记为解决方案!