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

2015-02-18 15:17:38  访问(1796) 赞(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)
 
  ┈全部┈  
 
(显示默认分类)