CSS 将图像对齐页面的中间和中心

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS 将图像对齐页面的中间和中心相关的知识，希望对你有一定的参考价值。

#enter {
	position: absolute;
	text-align: center;
	left: 50%;
	top: 50%;
	margin: -120px auto 0 -130px; /* value of top margin: height of the image divide by 2 (ie: 240 / 2), value of left margin: width of the image divide by 2 (ie: 260 / 2) */
	width: 260px; /* same as the image width */
}

#enter span a {
	display: block;
	width: 260px;
	height: 240px;
	margin: 0 auto;
	position: relative;
	background: transparent url(images/enter.jpg) 0 0 no-repeat;
	text-indent: -5000em;
	outline: 0;
}




<body id="homepage">
    <div id="enter">
	<span><a href="/home">Enter Site</a></span>
    </div>
</body>

以上是关于CSS 将图像对齐页面的中间和中心的主要内容，如果未能解决你的问题，请参考以下文章

浮动后对齐中心项目

如何将图像对齐到中心？ [关闭]

引导文本和图像在中间对齐[重复]

如何对齐页面中心的列？ [复制]

CSS垂直对齐文本到图像的中间[重复]

图像 <a> 垂直和水平对齐中心并在两者中都使用 % 调整大小