正确的方法居中一个div[副本]
为了测试目的，重新创建（不完全）这个站点的风格，下面的代码是正确的方法吗？我是说，这会是最常见的/最好的方法吗？
很抱歉，如果这个问题太简单了，但这是因为我发现有很多模板使用display、position、top、left等，因为我对web dev，所以我想我可能做错了什么--因为我只使用了几行。
附注：我没有使用text-align:center是因为我使用的是bootstrap的text-center类，我想它也是这样做的。
null
body {
background-color: #2098D1 !important;
}
h1, p {
color: white !important;
}
.site-wrapper {
margin-top: 230px;
}
.site-wrapper p {
margin-top: 15px;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="site-wrapper text-center">
<h1>Responsive Front-end Development</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
</div>
</body>
</html>null
谢谢你，路易斯。
共有2个答案
div元素是一个块元素，因此，如果您想要水平居中，最简单的方法是使用margin auto方法。
.site-wrapper{
width:1200px; //you have to give specific width value
margin: 0 auto;}
如果您要询问的是如何在div中垂直居中内容，则可以使用display:flex；
试试看：
.site-wrapper {
height: 75%;
display: flex;
align-items: center; /*Horizontally centers content*/
justify-content: center; /*Vertically centers content*/
flex-direction: column; /* Makes content in div to flow under instead of side by side*/
}
-
问题内容： 我想将居中。但是，事实并非如此。我只想找出原因以及如何使其居中。 问题答案： 您需要设置容器的宽度。（不起作用） MDN的CSS参考说明了这一切。
-
本文向大家介绍怎样把一个div居中？怎样把一个浮动元素居中？怎样把绝对定位的div居中？相关面试题，主要包含被问及怎样把一个div居中？怎样把一个浮动元素居中？怎样把绝对定位的div居中？时的应答技巧和注意事项，需要的朋友参考一下 主要用到: text-alin: center; margin: 0 auto; position: relative | absolute; left: 50%; v
-
问题内容： 我想将添加到另一个div内的div居中。 这是我当前正在使用的CSS。 如您所见，我现在使用的方法取决于width和height的值。如果width / height发生变化，我将不得不修改and值。是否有任何通用解决方案可用于始终将居中对齐它的大小？ 我发现使用可以将innerDiv水平分配到中间，但是垂直分配中间呢？ 问题答案： tl; dr 垂直对齐中间作品，但是您将不得不在父元
-
我做错了什么？
-
我是Spring的新手。在@Bean方法中注入Bean的这两种方法有什么区别？我应该使用哪个，为什么？ 而且
-
问题内容： 我正在尝试垂直居中放置两个元素。 我在phrogz.net上按照教程进行操作，但仍然将元素放置在div上方，div下方，在div中顶部对齐。 我会尝试其他方法，但是这里的大多数问题都只是指向该教程。 此代码段用于网页顶部的横幅。 问题答案： 添加以下内容：display：table; 到bannerRight 显示：表格单元格；和vertical-align：middle; 向bann