Web ページ要素の位置が乱れている場合は、「要素を検査」をクリックして元に戻します。

WBOY
リリース: 2016-06-23 13:58:35
オリジナル
1307 人が閲覧しました

当初は通常通りWebページが表示されていましたが、後にオンラインカスタマーサービス.phpが同梱されました。
Firefox、IE11、および 360 互換モードでは正常に動作しますが、360 スピード モードと Google Chrome では位置がずれますが、[要素の検査] を右クリックするとすべてが正常に戻ります...
原因は何ですか?

以下に 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.height='100%';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}
ログイン後にコピー


Web サイトは China CNC Network です


ディスカッション (解決策) に返信します

で WeChat QR コードを非表示にしますホームページ これは正常ですが、他のページはまだ位置がずれています

ホームページで WeChat QR コードを隠しましたが、正常でしたが、他のページは依然として間違って配置されました


一部の ID クラスが競合しています。

素晴らしいですね...ID クラスの競合ではなく、外側でラップされた div もありません。
以前は header.php に配置されていましたが、現在は footer.php の下部に配置されています。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート