html – 如何使用BootStrap水平居中表单？

发布时间：2020-12-14 16:42:26 所属栏目：资源来源：网络整理

导读：您好我在尝试使用BootStrap 2在屏幕中间放置一个登录表单.我已尝试使用偏移等几种组合.但我似乎没有运气.. div class="row-fluid" form action='' method='POST' id='loginForm' class='form-horizontal' autocomplete='off' ... /form/div 有关如何实现这一

您好我在尝试使用BootStrap 2在屏幕中间放置一个登录表单.我已尝试使用偏移等几种组合.但我似乎没有运气..

<div class="row-fluid">
    <form action='' method='POST' id='loginForm' class='form-horizontal' autocomplete='off'>
    ...
    </form>
</div>

有关如何实现这一目标的任何建议？

解决方法

如果你想使用网格系统,请按照@ Pickle的回答开始.这将使包含表单的跨区列居中.如果你希望表格在那个范围内居中,你将不得不做更多的工作,比如@kajo在你的问题评论中提到的事情.

要详细说明@Pickle的答案,这里有一些示例代码,它们在默认的12列网格中以4列的范围为中心.如果您需要跨越不同数量的列,请使用@ Pickle的公式(但请记住,您的跨栏列数必须是偶数)

<div class="container">
  <div class="row">
    <div class="offset4 span4">
      .. form goes here ..
    </div>
  </div>
</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!