zoukankan      html  css  js  c++  java
  • 1.解决自适应布局中div内部img距离底部4px的空白问题?2. img怎么实现水平垂直居中?

    1.解决自适应布局中div内部img距离底部4px的空白问题?

    示例代码:

    <style>
    .t1{
    自适应布局,外层盒子不给宽高(由内部元素撑开)
    }

    img{
    /* vertical-align:bottom; */     1.设置img vertical-align:bottom
    /* display:block; */     2.img 变成块级元素 display:block;  变成块级元素就无法在父元素设置可继承的text-align:center等了,而是使用 margin:xx auto;  水平居中


    </style>

    <body>
       <div class="t1">
      <img src="./TIM截图20171211210255.png" alt="">
      </div>

    </body>

    -------------------------------------------------------------------------------------

    2. img怎么实现水平垂直居中?

        1.

    .t1{
    /* 100px;
    height: 100px; */
    /* display:table-cell; */     //父元素添加:display:table-cell  text-align:center   vertical-align:middle
    /* text-align:center;
    vertical-align:middle; */


    /* position:relative; */      //或者父元素相对定位  子元素绝对定位
    }

    img{
    /* position:absolute;
    left:50%;
    top:50%;


    -webkit-transform: translate(-50%,-50%);     //transform margin 二选一即可
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    margin-left:-30px;
    margin-top:-30px; */

    }

  • 相关阅读:
    rman备份与异机恢复
    定时导出用户数据(expdp,impdp)
    简单配置oracle11g
    oracleLinux7上安装oracle11g r2(脚本简单配置环境)
    快速排序
    从零开始学 Java
    从零开始学 Java
    从零开始学 Java
    从零开始学 Java
    Windows服务调试小结(附Demo)
  • 原文地址:https://www.cnblogs.com/ccnNL/p/8541834.html
Copyright © 2011-2022 走看看