Fatal编程技术网
  • css/
  • Css 在引导3中居中窗体

Css 在引导3中居中窗体

css twitter-bootstrap-3

Css 在引导3中居中窗体,css,twitter-bootstrap-3,Css,Twitter Bootstrap 3,我试图在bootstrap中将内容集中到中心，我搜索并找到了解决方案，但这对我不起作用，有人能在这里帮助我吗 <style> .center{ margin:0 auto; } </style> <div class="center"> <form method="post" action="" enctype="multipart/form-data"> <div class="row">

我试图在bootstrap中将内容集中到中心，我搜索并找到了解决方案，但这对我不起作用，有人能在这里帮助我吗

<style>
   .center{
      margin:0 auto;
   }
</style>

<div class="center">
  <form method="post" action="" enctype="multipart/form-data">
    <div class="row">
      <div class="form-group col-xs-12 col-sm-6 col-md-3 col-lg-3">
        <label for="name">Book Name</label>
        <input type="text" name="name" class="form-control" id="name">
      </div>
    </div>
    <div class="row">
      <div class="form-group col-xs-12 col-sm-6 col-md-3 col-lg-3">
        <label for="author_id">Author</label>
        <select name="author_id" class="form-control" id="author_id">
          <option value="author_id">Author</option>
        </select>
      </div>
    </div>
  </form>
</div>


.中心{
保证金：0自动；
}
书名
作者
作者
以便
.center
div以
边距居中：0自动它还需要设置一个
宽度
值。默认情况下，div占其容器宽度的100%。如果div为100%宽，则无法居中，因为它在技术上已经居中。您可以给
.center
一个宽度来修复此问题


.center {
    width: 400px;
    margin:0 auto;
}


你可能不想要一个固定的宽度，但事实上，我想说，你肯定不希望，考虑到你使用的是一个响应模板

更好的解决方案是以内容为中心，而不是以div容器为中心

尝试添加
文本对齐：居中到
表单组
类，或使用
文本对齐：居中创建自己的类
并将该类添加到对标签/输入进行分组的HTML div中


.form-group {
    text-align: center;
}



这个链接对你有帮助吗？为了使用
margin:0 auto
技巧，您需要为容器指定一个固定的宽度。使用“文本中心”而不是“中心”（引导类）您是否尝试过使用
class=“中心块”
？看见