您好,欢迎访问一九零五行业门户网

如何在CSS里面设置DIV里面的图片垂直居中_html/css_WEB-ITnose

现在用div来定位的方式使用得越来越广泛。
我最近在使用div定位图片的时候,发现div不能直接设置图片的垂直对齐方式
狠伤了一阵脑筋,然后到网上找了很多解决办法。
但是似乎都不太行,后来发现了  孟子e章(我超级惊讶孟子e章的知识广泛程度) 
给别人回答问题的一个帖子里面
有一个解决方法看起来很正宗。如下
style =position:absolute; 
width:500px; 
height:305px; 
z-index:1; 
background-color: #999999; 
border: 1px none #000000;
padding-top:expression(this.style.top+(this.offsetheight-mxh.offsetheight)/2)  
align =center  >
div >
拿来用了以后发现还是不能成功。
接下来又查了一下资料,发现他这个方法里面有两个问题。
this.style.top 取出来的不是数字而是一个字符串,例如 50px,所以expression里面没有办法运算。正确的方法应该是 this.style.pixeltop属性,这样取出来的才是数字。 图片放到div里面以后,其top属性值的计算不再是从窗口的左上角开始计算,而是从div容器的左上角开始计算,因此div的上填充距离不需要再加上div的top值 依据以上两点,我对孟子e章的方法进行了些许的修改,得到下面的这个方法。我测试过是成功的。
整个过程费了不少时间,这里贴出来分享给大家,省得大家再走弯路,尤其是还没有使用过expression的朋友们。
    style =
        position:absolute; 
        left:261px; 
        top:50px; 
        width:251px; 
        height:105px; 
        z-index:1; 
        overflow:hidden; 
        border: 1px solid #0066cc;
        padding-top:expression((this.offsetheight-myimage.offsetheight)/2);
align =center >
div >
有一个关键点提醒大家注意一下,图片要给出id,才能进行计算。切记~
感谢孟子e章,感谢他的博学,呵呵呵
再一次惊叹于孟子e章知识面的广阔。
其它类似信息

推荐信息