当前位置:首页 > 帮助中心 > 建站常见问题 > 详细说明

建站常见问题

图片自适应居中如何设置?

作者:51网络科技 来源:www.51cdz.cn浏览次数:1

购买国内免备案空间 购买香港空间【不限iis】 购买美国空间【不限流量及CPU】
.Net专用空间 成品网站【程序+域名+空间】 特价美国空间
国内IP【不用备案】 优惠套餐 香港云主机/VPS
div部分

<div class="cert_img"><p><img src="images/1.jpg"  onload="fixImage(this,201,146)"/></p></div>

样式部分
.cert_img{ width:201px; height:146px; border:1px solid #bdbdbd;overflow:hidden; padding:6px;position:relative;display:table-cell;text-align:center;vertical-align:middle}

.cert_img p{ margin:0; padding:0;position:static;+position:absolute;top:50%}

.cert_img img{position:static;+position:relative;top:-50%;left:-50%;}

js部分,要先让js加载

<script type="text/javascript" language="javascript">

function fixImage(i,w,h){

var ow = i.width;

    var oh = i.height;

    var rw = w/ow;

    var rh = h/oh;

    var r = Math.min(rw,rh);

    if (w ==0 && h == 0){

    r = 1;

        }else if (w == 0){

        r = rh<1?rh:1;

            }else if (h == 0){

            r = rw<1?rw:1;

                }

     if (ow!=0 && oh!=0){

      i.width = ow * r;

        i.height = oh * r;

        }else{

        var __method = this, args = $A(arguments);

            window.setTimeout(function() {

            fixImage.apply(__method, args);

                }, 200); ??? }

                i.onload = function(){} }

</script>

关注官方微信公众号(mianbeian
领取主机优惠券!绝对不含糊!