绝对中心（垂直及水平）的图像代码,Css代码库,德仔网

代码语言

代码分类

【Css】绝对中心（垂直及水平）的图像

作者:Duncan / 发布于2014/11/18/ 476


	/* CSS background-image Technique: */

	html {
	 width:100%;
	 height:100%;
	 background:url(logo.png) center center no-repeat;
	}

	/* CSS + Inline Image Technique: */

	img {
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 width: 500px;
	 height: 500px;
	 margin-top: -250px; /* Half the height */
	 margin-left: -250px; /* Half the width */
	}

	/* Table technique: */

	html, body, #wrapper {
	 height:100%;
	 width: 100%;
	 margin: 0;
	 padding: 0;
	 border: 0;
	}
	#wrapper td {
	 vertical-align: middle;
	 text-align: center;
	}

	/* HTML */

	<html>
	<body>
	 <table id="wrapper">
	 <tr>
	 <td><img src="logo.png" alt="" /></td>
	 </tr>
	 </table>
	</body>
	</html>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　绝对中心　

同语言下

可能有用的

Duncan贡献的其它代码(49)