日期:2014-05-16  浏览次数:20615 次

css实现DIV居低功能,但在手机的火狐浏览器上出现链接偏移
很奇怪,在PC的火狐、IE浏览器和iphone的浏览器上都能正常使用

但在手机火狐浏览器打开时,页面布局显示虽然正常,但img的点击事件的位置却出现了偏移,即我要在原图片的位置再左上的位置点击才会触发onclick事件

CSS部分

<style type="text/css">
.shape{width: 100%;  height: 100px; position:fixed!important; position:absolute;bottom:5px!important; bottom:auto; top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop+(documentElement.clientHeight - this.clientHeight):document.body.scrollTop+(document.body.clientHeight - this.clientHeight));}
</style>

BODY部分

<div id="top" class="shape" >
<table width="100%" background="pages/wap/images/06.gif" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="25%"><div style="text-align: center;"><img src="pages/wap/images/08.gif" width="55" height="49" onclick="goHome();"/></div></td>
        <td width="25%"><div style="text-align: center;"><img src="pages/wap/images/09.gif" width="55" height="49"  onclick="goBack();"/></div></td>
        <td width="25%"><div style="text-align: center;"><img src="pages/wap/images/10.gif" width="55" height="49"  onclick="goHelp();"/></div></td>
        <td width="25%"><div style="text-align: center;"><img src="pages/wap/images/11.gif" width="55" height="49"  onclick="goLogin();"/></div></td>
        </tr>
    </table>
</div>




------解决方案--------------------
把img的格式,设置成display=block试试看。。。
------解决方案--------------------
是不是img标签上下居中了?

.shape{width: 100%;  height: 100px;}
这个里面的高度不能调吗?
为啥你img的高度49px,这个里面却加了个100px?

这样,在电脑上的浏览器,img是顶部对齐的,下部会有一些空白。

如果这个宽度不是非得100px,只是为了在下面加个空白,那用margin-bottom也可以的。

这样,height:50px;margin-bottom:50px;
跟你原来的效果也是一样的。
------解决方案--------------------
那你得继续加油了,很抱歉的说,我帮不了忙了!!

移动端的开发,不太熟~~~

加油加油,