使用Bootstrap的多行输入表单域
提问于 2013-01-18 17:17:53
<form class="span6">
<h2>Get In Touch</h2><br>
<input class="span6" type="text" placeholder="Your first name" required>
<input class="span6" type="text" placeholder="Your last name" required>
<input class="span6" type="email" placeholder="Your email" required>
<input class="span6" type="text" placeholder="Your phone number">
<input class="span6" type="text" rows="3" placeholder="What's up?" required><br>
<button type="submit" class="btn btn-primary">Submit</button>
<button type="clear" class="btn">Clear</button>
</form><!--/.span6-->这是我在Bootstrap中使用的表单。我试图让我的最后一个输入域横跨6列，向下3行，但它只显示为6列，1行。有什么办法可以让我的输入框变大吗？谢谢。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-01-18 17:36:03
我认为问题在于你使用的是type=“文本”而不是文本区域。你想要的是：
<textarea class="span6" rows="3" placeholder="What's up?" required></textarea>为了清楚起见，type=“文本”总是一行，而文本区域可以是多行。
Stack Overflow用户
发布于 2014-08-23 19:18:48
Nick Mitchinson的答案是Bootstrap版本2。
如果您使用的是Bootstrap版本3，那么表单会有一些变化。对于bootstrap 3，请使用以下代码：
<div class="form-horizontal">
<div class="form-group">
<div class="col-md-6">
<textarea class="form-control" rows="3" placeholder="What's up?" required></textarea>
</div>
</div>
</div>其中，col md-6将以中型设备为目标。您可以添加col xs-6等来瞄准较小的设备。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14404157
复制相关文章
点击加载更多
腾讯云开发者
