纯css实现div容器内图片上下左右居中效果

2015-02-18 15:17:38  访问(1794) 赞(0) 踩(0)

  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>纯css实现div容器内图片上下左右居中效果</title>
<style type="text/css">
*{ margin:0; padding:0; list-style:none;}
img{ border:none;}

.slowx{ width:600px; height:400px; margin:100px auto;text-align:center;vertical-align:middle;display:block;position:relative; background:#ddd;}
.slowx a{display:table-cell;vertical-align:middle;width:600px; height:400px; }
.slowx a img{max-width:600px;max-height:400px; }
</style>
</head>

<%=VersionHideInfo%>

<body>
<div class="slowx">
<a href="<%=strWebPhyPath%>" target="_blank"><img src="<%=strWebPhyPath%>/images/js/pic5.png" alt="霜叶工作室" /></a>
</div>
</body>
</html>


参考来源：http://www.lanrenzhijia.com/comm/2714.html


上一条：

下一条：


版权声明：
如果本站的资源使用了您的作品，请联系我们，我们会及时的注明
本站所有的资源均为免费自由下载，目的是让大家学习和交流
由于收集过程中几经转载，所以很多作品的原作者不详
如果您不愿在本站展示，请联系我们，我们会及时删除
 

相关评论

评论加载中……
 

发表评论

类型：
内容：
  (Alt+Enter)
 
  ┈全部┈  
 
（显示全部分类）