Heim  >  Artikel  >  Backend-Entwicklung  >  网页元素位置错乱 点击“审查元素”恢复

网页元素位置错乱 点击“审查元素”恢复

WBOY
WBOYOriginal
2016-06-23 13:58:351307Durchsuche

原先网页都正常显示的,后来include了一个在线客服.php进来。
Firefox、IE11、360兼容模式中正常;360极速模式、Google Chrome中就会错位,但是点击右键“审查元素”就又都会恢复正常...
请问是什么原因?

下面是include进来的一个div

<DIV id=kefu onmouseover=toBig() onmouseout=toSmall()><TABLE style="FLOAT: left" border=0 cellSpacing=0 cellPadding=0 width=157>  <TBODY>  <TR>    <TD class=main_head height=39 vAlign=top> </TD></TR>  <TR>    <TD class=info vAlign=top>      <TABLE class=qqtable border=0 cellSpacing=0 cellPadding=0 width=120       align=center>        <TBODY>        <!-- <TR>          <TD align=middle><a href="" target="_blank"><IMG border=0             src="images/kefu/kefu_head.gif"></a> </TD>        </TR>        <TR>          <TD height=5></TD></TR> -->		<TR>          <TD height=5 align=middle><SPAN>机加工-徐工:</SPAN></TD></TR>        <TR>          <TD height=30 align=middle><SPAN><a target="_blank" href=""><img border="0" src="" alt="机加工产品相关请联系我" title="机加工产品相关请联系我"/></a></SPAN></TD></TR>        <TR>          <TD height=8 align=middle></TD></TR>		<TR>          <TD height=5 align=middle><SPAN>计量设备-周工:</SPAN></TD></TR>        <TR>          <TD height=30 align=middle><SPAN><a target="_blank" href=""><img border="0" src="" alt="计量设备相关请联系我" title="计量设备相关请联系我"/></a></SPAN></TD></TR>        <TR>          <TD height=8 align=middle></TD></TR>		<TR>          <TD height=5 align=middle><SPAN>网络-小俞:</SPAN></TD></TR>        <TR>          <TD height=30 align=middle><SPAN><a target="_blank" href=""><img border="0" src="" alt="点击这里给我发消息" title="点击这里给我发消息"/></a></SPAN></TD></TR><TR>          <TD height=5></TD></TR>        <TR>          <TD height=5 align=middle><SPAN>中国数控网官方微信:</SPAN></TD></TR>        <TR>          <TD height=135 vAlign=top align=middle><A href="images/kefu/2d.png" target="_blank"><IMG border=0 src="images/kefu/2d.png" width=130 height=130></A></TD>        </TR>        <TR>          <TD align=middle> </TD></TR></TBODY></TABLE></TD></TR>  <TR>    <TD class=down_kefu vAlign=top></TD></TR></TBODY></TABLE><DIV class=Obtn></DIV></DIV><SCRIPT language=javascript>		客服=function (id,_top,_left){		var me=id.charAt?document.getElementById(id):id, d1=document.body, d2=document.documentElement;		d1.style.height=d2.style.   style="max-width:90%";me.style.top=_top?_top+'px':0;me.style.left=_left+"px";//[(_left>0?'left':'left')]=_left?Math.abs(_left)+'px':0;		me.style.position='absolute';		setInterval(function (){me.style.top=parseInt(me.style.top)+(Math.max(d1.scrollTop,d2.scrollTop)+_top-parseInt(me.style.top))*0.1+'px';},10+parseInt(Math.random()*20));		return arguments.callee;		};		window.onload=function (){		客服		('kefu',100,-152)		}</SCRIPT><SCRIPT language=javascript> 			lastScrollY=0; 						var InterTime = 1;			var maxWidth=-1;			var minWidth=-152;			var numInter = 8;						var BigInter ;			var SmallInter ;						var o =  document.getElementById("kefu");				var i = parseInt(o.style.left);				function Big()				{					if(parseInt(o.style.left)<maxWidth)					{						i = parseInt(o.style.left);						i += numInter;							o.style.left=i+"px";							if(i==maxWidth)							clearInterval(BigInter);					}				}				function toBig()				{					clearInterval(SmallInter);					clearInterval(BigInter);						BigInter = setInterval(Big,InterTime);				}				function Small()				{					if(parseInt(o.style.left)>minWidth)					{						i = parseInt(o.style.left);						i -= numInter;						o.style.left=i+"px";												if(i==minWidth)							clearInterval(SmallInter);					}				}				function toSmall()				{					clearInterval(SmallInter);					clearInterval(BigInter);					SmallInter = setInterval(Small,InterTime);									}				</SCRIPT>


CSS文件是这样的:
.main_head {	BACKGROUND: url(../images/kefu/img3-5_2.png) no-repeat}* HTML .main_head {	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/kefu/img3-5_2.png",sizingMethod='crop'); BACKGROUND: none transparent scroll repeat 0% 0%}* + HTML .main_head {	BACKGROUND: url(../images/kefu/img3-5_2.png) no-repeat}.info {	PADDING-BOTTOM: 10px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND: url(../images/kefu/img3-5_3.png) repeat-y; PADDING-TOP: 5px}* HTML .info {	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/kefu/img3-5_3.png",sizingMethod='crop'); BACKGROUND-REPEAT: repeat-y}* + HTML .info {	PADDING-BOTTOM: 10px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND: url(../images/kefu/img3-5_3.png) repeat-y; PADDING-TOP: 5px}.down_kefu {	WIDTH: 157px; BACKGROUND: url(../images/kefu/img3-5_4.png) no-repeat; HEIGHT: 8px}* HTML .down_kefu {	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/kefu/img3-5_4.png",sizingMethod='crop'); WIDTH: 157px; BACKGROUND-REPEAT: repeat-y; HEIGHT: 8px}* + HTML .down_kefu {	WIDTH: 157px; BACKGROUND: url(../images/kefu/img3-5_4.png) no-repeat; HEIGHT: 8px}.Obtn {	MARGIN-TOP: 104px; WIDTH: 32px; BACKGROUND: url(../images/kefu/img3-5_1.png) no-repeat; FLOAT: left; HEIGHT: 139px; MARGIN-LEFT: -5px}* HTML .Obtn {	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/kefu/img3-5_1.png",sizingMethod='crop'); WIDTH: 32px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; HEIGHT: 139px}* + HTML .Obtn {	MARGIN-TOP: 104px; WIDTH: 32px; BACKGROUND: url(../images/kefu/img3-5_1.png) no-repeat; FLOAT: left; HEIGHT: 139px; MARGIN-LEFT: -5px}.qqtable SPAN {	PADDING-BOTTOM: 5px; LINE-HEIGHT: 20px; PADDING-LEFT: 0px; WIDTH: 100px; PADDING-RIGHT: 0px; COLOR: #ff6600; FONT-SIZE: 13px; FONT-WEIGHT: bold; PADDING-TOP: 5px}.qqtable A {	TEXT-DECORATION: none}.qqtable A:hover {	TEXT-DECORATION: none}.qun {	BORDER-BOTTOM: #ffd2bf 1px solid; BORDER-LEFT: #ffd2bf 1px solid; PADDING-BOTTOM: 5px; LINE-HEIGHT: 20px; BACKGROUND-COLOR: #ffffff; PADDING-LEFT: 0px; WIDTH: 100px; PADDING-RIGHT: 0px; FONT-SIZE: 12px; BORDER-TOP: #ffd2bf 1px solid; BORDER-RIGHT: #ffd2bf 1px solid; PADDING-TOP: 5px}.qun SPAN {	COLOR: #ff6600; FONT-SIZE: 13px; FONT-WEIGHT: bold}


网址是 中国数控网


回复讨论(解决方案)

首页我把微信二维码隐藏掉了 就正常了,但是其它页面还是错位的

把你的

首页我把微信二维码隐藏掉了 就正常了,但是其它页面还是错位的


某些 id class冲突了!  

太神奇了...不是id class的冲突 也没有在外面包一个div。
原来是放到header.php里面的  现在放到footer.php的最下面就好了...

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn