图片上下左右居中

来源：互联网发布：matlab哈密顿回路算法编辑：程序博客网时间：2024/05/16 05:00

 <style>        body{            margin: 0;            padding: 0;        }        /*方法一*/        .box{            position: relative;            width: 300px;            height: 300px;            border: 1px solid red;        }        .box img{            position: absolute;            top: 0;            left: 0;            right: 0;            bottom: 0;            margin: auto;        }        /*方法二*/        .box {            display: table-cell;            vertical-align:middle;            text-align:center;            width:200px;            height:200px;            border: 1px solid red;        }        .box img{            vertical-align: middle;        }        /*方法三*/        .box{            width: 300px;            height: 300px;            border: 1px solid red;            position: relative;        }        .box img{            width: 100px;            height: 100px;            background-color: black;            position: absolute;            left: 50%;            top: 50%;            margin-top: -50px;            margin-left: -50px;        }    </style><body>    <div  class="box">        <img src="images/public/logo_s.png">    </div></body>

参考：http://www.cnblogs.com/2050/p/3392803.html

0 0