zoukankan      html  css  js  c++  java
  • 用CSS使图片上下左右都绝对居中于DIV

    <!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>无标题文档</title>
    <style>
    <!--
    * {margin:10;padding:10}
    div {
    width:180px;
    height:180px;
    border:1px solid #000;
    position:relative;
    display:table-cell;
    text-align:center;
    vertical-align:middle
    }
    div p {
    position:static;
    +position:absolute;
    top:50%
    }
    div img {
    position:static;
    +position:relative;
    top:-50%;left:-50%;
    }
    --> 
    </style></style>
    </head>
    <body>
    <div> 
    <p><img src="http://www.domix.cn/static/team/2011/0225/12986229678396.jpg" width="120" height="120" /></p> 
    </div>
    <div> 
    <p><img src="http://www.domix.cn/static/team/2011/0225/12986229678396.jpg" width="160" height="160" /></p> 
    </div>
    <div> 
    <p><img src="http://www.domix.cn/static/team/2011/0225/12986229678396.jpg" width="130" height="160" /></p> 
    </div>
    <div> 
    <p><img src="http://www.domix.cn/static/team/2011/0225/12986229678396.jpg" width="170" height="110" /></p> 
    </div>
    </body>
    </html>
  • 相关阅读:
    使用Apache Curator监控Zookeeper的Node和Path的状态
    mongo创建用户
    window下关闭nginx
    spring 下载地址
    Quartz Spring与Spring Task总结
    oracle 11g 空表也导出
    修改oracle字符集
    linux 查看最大文件
    JAVA https证书相关
    抽象类与接口
  • 原文地址:https://www.cnblogs.com/visi_zhangyang/p/3323764.html
Copyright © 2011-2022 走看看