引导表单太大
我正在尝试设计一个形式在一个面积的宽度Col-SM-8。表单中有三列：标签、文本输入和用户名检查。标签宽度为col-sm-2，用户名检查宽度为col-sm-1，其余为文本输入。我的计算是文本输入应该有5的宽度，但结果太难看了。我尝试手动将宽度设置为col-sm-7，但仍然不够长。如果我将文本输入的宽度设置为col-sm-8，那么我会在网页底部看到滚动条。我的目标是1。将标签宽度设置为左侧的col-sm-2；2.将用户名检查的宽度设置为右侧的col-sm-1；3.文本输入中间取整宽。请问如何实现这一点？下面是我的旧代码：
<div class="col-sm-8" id="content" style="border-left: #dbe0e3 1px solid;">
<form name="form_register" id="form_register" method="post" class="form-horizontal">
<fieldset>
<legend class="text-center">Enter your details below.</legend>
<div class="form-group">
<label for="username" class="col-sm-2 control-label">Username *</label>
<div class="col-sm-7">
<input type="text" name="username" id="username" class="form-control" maxlength="40" required />
</div>
<div class="col-sm-1"><span id="usernameCheck"></span></div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">Password *</label>
<div class="col-sm-7">
<input type="password" name="password" id="password" class="form-control" maxlength="20" />
</div>
</div>
我的新代码的结果更好，但我只是想知道是否有更优雅的方法：将用户名的div从
<div class="col-sm-7">
至
<div class="col-sm-7" style="width:75%">
共有1个答案
这段代码对您有帮助
null
<html>
<head>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
</head>
<body>
<div class="col-sm-8" id="content" style="border-left: #dbe0e3 1px solid;">
<form name="form_register" id="form_register" method="post" class="form-horizontal">
<fieldset>
<legend class="text-center">Enter your details below.</legend>
<div class="form-group">
<label for="username" class="col-sm-2 control-label">Username *</label>
<div class="col-sm-7">
<input type="text" name="username" id="username" class="form-control" maxlength="40" required />
</div>
<div class="col-sm-1"><span id="usernameCheck">User Error Check</span></div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">Password *</label>
<div class="col-sm-7">
<input type="password" name="password" id="password" class="form-control" maxlength="20" />
</div>
</div>
</body>
</html>-
我试图获得全宽登录表单。基本上，用户名、密码和按钮的输入字段都应该是相同的长度。现在我可以很容易地使用跨度来获得这个，问题是当我在用户名和密码上有一个“前置”的图标时，输入字段会延伸到跨度（如果我将输入块级别应用到输入）和按钮跨度只到外部跨度变短（如果我尝试btn-block）。如何让所有元素只拉伸到包含的跨度宽度？ 这是我的小提琴。 http://jsfiddle.net/sujesharuki
-
问题内容： 当我使用发布请求发送大文件时，系统显示异常： 当我在Google中搜索帮助时，他们会提供一些帮助，例如， 我正在使用此代码，但问题仍未解决 我也在使用代码 但是没有结果 注意：-我正在使用Jetty-6.1.0 问题答案： 尝试通过设置系统属性 好的，您可以从网络应用中对其进行配置 在您的Web应用程序中添加文件，并在该文件中配置参数： 文件 版本7或更高版本 从版本7开始，Jetty
-
我正在将VueJs与引导一起使用。使用当前代码，我只能选择整行。可以选择一个或多个表格单元格吗？ 希望你能帮助我！
-
问题内容： 我想使用引导程序来获得不错的网站设计，但是不幸的是，我不知道表单字段的样式。我在说这个： 应该如何设计呢？我尝试了这个： 这显然没有给我想要的结果。 如何将引导样式应用于Django表单？ 问题答案： 如果你不想使用第三方工具，那么从本质上讲，你需要向类中添加属性，我更喜欢通过使模型表单继承自一个基类来实现。 可以轻松调整…但是如你所见，我所有的字段小部件都已应用了表单控件css类 你
-
我对Angular很陌生，我正在尝试使用Angular和Bootstrap 4创建一个注册表单。 我想要的结果是使用Bootstrap的样式和Angular的验证。更准确地说，在验证表单时，Angular在两个不同的地方应用样式(ng-valid、ng-invalid等）：input元素和form元素。 我使用的是反应形式，我想避免这样的事情（未测试）： 有没有一个简单的方法（不是太冗长）来实现这
-
我使用引导表插件-http://bootstrap-table.wenzhixin.net.cn 有一种访问隐藏列的方法—getHiddenColumns，但没有getVisibleColumns方法。实际上，我只想在可见列上搜索，因为我需要可见列的名称。 我怎样才能得到它？任何帮助都将不胜感激。提前谢谢。