Html 如何使用Bootstrap 3对齐表单中的单独行?
我正在用Bootstrap3在一个水平的表格上和食物作斗争。如果我把每一组表格一个接一个地放在一起,我就没有问题了。检查图像: 但一旦我做了两行,这样我就可以在前3个输入字段的右侧放置一个图像,那一行中的所有内容都会展开,并且底部一行的垂直内容都会被弄乱: 代码如下:Html 如何使用Bootstrap 3对齐表单中的单独行?,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,我正在用Bootstrap3在一个水平的表格上和食物作斗争。如果我把每一组表格一个接一个地放在一起,我就没有问题了。检查图像: 但一旦我做了两行,这样我就可以在前3个输入字段的右侧放置一个图像,那一行中的所有内容都会展开,并且底部一行的垂直内容都会被弄乱: 代码如下: <form id="new-user-form" class="form-horizontal"> <div class="row"> <div class="col-sm
<form id="new-user-form" class="form-horizontal">
<div class="row">
<div class="col-sm-9">
<div class="form-group">
<label class="col-md-2 control-label">Nombre</label>
<div class="col-md-10">
<input class="form-control" name="fname" placeholder="Nombre" type="text">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Apellido</label>
<div class="col-md-10">
<input class="form-control" name="lname" placeholder="Apellido" type="text">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Usuario</label>
<div class="col-md-10">
<input class="form-control" name="username" placeholder="Nombre de Usuario" type="text" disabled="">
</div>
</div>
</div>
<div class="col-sm-3"><div class="form-group">
<div class="col-md-12 text-center">
<img src="img/mysteryman.png" />
</div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<label class="col-md-2 control-label">E-mail</label>
<div class="col-md-10">
<input class="form-control" name="emailaddress" placeholder="Dirección de e-mail" type="email">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Tel. Celular</label>
<div class="col-md-10 no-padding">
<div class="col-xs-5 col-sm-4">
<input class="form-control" name="codtelcelular" placeholder="Código de Area" type="tel">
</div>
<div class="col-xs-7 col-sm-8">
<input class="form-control" name="telcelular" placeholder="Teléfono Celular" type="tel">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Tel. Fijo</label>
<div class="col-md-10 no-padding">
<div class="col-xs-5 col-sm-4">
<input class="form-control" name="codtelfijo" placeholder="Código de Area" type="tel">
</div>
<div class="col-xs-7 col-sm-8">
<input class="form-control" name="telfijo" placeholder="Teléfono Fijo" type="tel">
</div>
</div>
</div>
</div>
</div>
</form>
名义
阿佩利多
乌萨里奥
电子邮件
塞勒尔酒店
菲乔电话
有什么想法吗?提前谢谢 您缺少一行
<form id="new-user-form" class="form-horizontal">
<div class="row">
<div class="col-sm-9">
<div class="form-group">
<div class="row">
<label class="col-md-2 control-label">Nombre</label>
<div class="col-md-10">
<input class="form-control" name="fname" placeholder="Nombre" type="text">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<label class="col-md-2 control-label">Apellido</label>
<div class="col-md-10">
<input class="form-control" name="lname" placeholder="Apellido" type="text">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<label class="col-md-2 control-label">Usuario</label>
<div class="col-md-10">
<input class="form-control" name="username" placeholder="Nombre de Usuario" type="text" disabled="">
</div>
</div>
</div>
</div>
<div class="col-sm-3"><div class="form-group">
<div class="col-md-12 text-center">
<img src="img/mysteryman.png" />
</div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<label class="col-md-2 control-label">E-mail</label>
<div class="col-md-10">
<input class="form-control" name="emailaddress" placeholder="Dirección de e-mail" type="email">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Tel. Celular</label>
<div class="col-md-10 no-padding">
<div class="col-xs-5 col-sm-4">
<input class="form-control" name="codtelcelular" placeholder="Código de Area" type="tel">
</div>
<div class="col-xs-7 col-sm-8">
<input class="form-control" name="telcelular" placeholder="Teléfono Celular" type="tel">
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Tel. Fijo</label>
<div class="col-md-10 no-padding">
<div class="col-xs-5 col-sm-4">
<input class="form-control" name="codtelfijo" placeholder="Código de Area" type="tel">
</div>
<div class="col-xs-7 col-sm-8">
<input class="form-control" name="telfijo" placeholder="Teléfono Fijo" type="tel">
</div>
</div>
</div>
</div>
</div>
</form>
名义
阿佩利多
乌萨里奥
电子邮件
塞勒尔酒店
菲乔电话