将屏幕中间的两个div与里面的图像对齐
我有以下html（最小）模板：
<body>
<div class="container">
<div class="top"><img src="img/hyphen_top.png" width="177" height="150"/></div>
<div class="bottom"><img src="img/hyphen_bottom.png" width="117" height="6"/></div>
</div>
</body>
仅使用css，我想将页面/屏幕中间的“顶部”div和“顶部”div下的“底部”div对齐，边距为顶部100px。我不能将顶部/底部以及主容器（“容器”）中的图像居中。
谢谢
共有2个答案
这是小提琴
.container {
width: 600px;
margin: 20px auto;
border: 1px solid #333;
}
.top {
width: 300px;
margin: 20px auto;
text-align: center;
}
.bottom {
width: 300px;
margin: 100px auto 0;
text-align: center;
}
试试这个：
.container {
text-align:center;
}
.bottom {
margin-top: 100px;
}
jsfiddle在这里：http://jsfiddle.net/5xTLh/
-
这一定是这里问得最多的问题之一，通常只是针对Android开发者网站。读完留档后，我只想来这里澄清一下。 我理解，为了创建优化的用户体验，每个屏幕大小和密度都必须有不同的可绘制内容。我只想要一个简单的背景图像。因此，我需要为mdpi、hdpi、xhdpi和xxhdpi创建背景图像。经过研究，我发现以下大小的文件夹： 超大型 （XHDPI）：640x960 大 （HDPI）：480x800 中 （M
-
问题内容： 嗨，我正在使用类似于以下内容的方法来将div定位在屏幕中间： 但是，这样做的问题是它将项目放置在页面的中间而不是屏幕的中间。因此，如果页面高了几个屏幕，而我使div出现时，我就位于页面的顶部（该部分的顶部显示在屏幕上）。您必须向下滚动才能查看它。 有人可以告诉我您如何将其显示在屏幕中间吗？ 问题答案： 只需添加即可，即使您向下滚动也可以看到它。
-
我正在尝试使用图像创建。网格有3列。 但我有一些问题： 正在离开屏幕，如下图所示。未正确设置s的宽度以适应。 这是我当前的代码。我应该改变什么来解决我的两个问题？ 根据这个答案，我尝试使用以下布局： 但它看起来像下图。每个图像视图占据整个屏幕的宽度： http://i.imgur.com/p8AXcKN.png
-
问题内容： 我有一个div，并且（说）里面有一个图像，高度始终固定为。 我想使图像水平居中。 这里有3种情况： 图片的宽度等于div的宽度，没有问题 图片的宽度小于div的宽度，我可以在这里使用 图片的宽度大于div的宽度 我希望图像的中心部分在div内可见。 意味着，如果image的宽度为和div的宽度为，并且 我希望图像的第10 px至110 px可见（因此，和的图像隐藏在div下） 是否可以
-
问题内容： 我在div中垂直对齐图像时遇到问题 据我所知，我需要“显示：块；” 定位图像在中心，这是可行的。同样在教程中，我找到了很多答案，但它们并不是“有用的”，因为我的所有图像都不在同一高度！ 问题答案： 如果容器中的高度固定，则可以将line-height设置为与高度相同，并且它将垂直居中。然后只需添加text-align使其水平居中即可。 编辑 您的代码应如下所示： 更新 现在是2016年
-
下面是第二个活动是如何启动的 然后在onCreate中： 和主题文件： 谢谢你的帮助