热门关键字:
jquery > jquery教程 > div+css > 网友20588分享图片水平垂直居中兼容IE和火狐、谷歌

网友20588分享图片水平垂直居中兼容IE和火狐、谷歌

2043
作者:管理员
发布时间:2013/4/22 15:28:01
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=261

首先非常感谢网友20588的无私分享,他发话说:第一次给分享哦,希望能让大家用到额,虽然很简单,但对于新手来讲,对学习很有帮助,所以整理出来分享给大家使用,最后带上Demo和下载的链接。。。


样式代码如下:

* {margin:0;padding:0}
div {
	width:500px;
	height:500px;
	border:1px solid #c00;
	overflow:hidden;
	position:relative;
	display:table-cell;
	text-align:center;
	vertical-align:middle
}
div p {
	position:static;
	+position:absolute;
	top:50%
}
img {
	position:static;
	+position:relative;
	top:-50%;left:-50%;

}


HTML代码如下:

<div>
  <p><a href="http://www.jq-school.com/" target="_blank"><img src="http://www.jq-school.com/images/logo.gif" width="358" height="96" /></a></p>
</div>


网友舞影凌风分享Jquery+HTML5实现进度条加载特效


网友舞影凌风分享Jquery+HTML5实现进度条加载特效





如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:css样式 word-break word-wrap 自动换行
友荐云推荐