Heim > Web-Frontend > HTML-Tutorial > 父元素相对定位后,子元素在ie下被覆盖的问题!_html/css_WEB-ITnose

父元素相对定位后,子元素在ie下被覆盖的问题!_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:34:07
Original
1299 Leute haben es durchsucht

<div id="append_parent" style="position: relative;">        <div id="zoomimglayer" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;            width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">            <img  id="zoomimg"   style="max-width:90%"                src="http://www.orico.com.cn/images/2013925141939458.jpg"  style="max-width:90%"  style="max-width:90%" alt="父元素相对定位后,子元素在ie下被覆盖的问题!_html/css_WEB-ITnose" >        </div>        <div id="zoomimglayer2" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;            width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">            <div id="dprev" title="上一张" style="position: absolute; left: 0; top: 20px; z-index: 1001;                cursor: pointer; width: 40%; height: 523px;" onclick="alert('上一张')">                <a style="top: 271.5px; position: absolute;" class="prev">上一张</a>            </div>            <!-- .main -->            <div id="dnext" title="下一张" style="position: absolute; right: 0; top: 20px; z-index: 1001;                cursor: pointer; width: 40%; height: 523px;" onclick="alert('下一张')">                <a style="position: absolute; top: 271.5px; right: 0;" class="next">下一张</a>            </div>        </div>    </div>
Nach dem Login kopieren

以上HTML定义一个父类相对定位,子元素绝对定位。

在ie下,元素zoomimglayer2 被 元素zoomimglayer 覆盖了。而在子元素zoomimglayer2上设置background样式才管用。求前端高手指点一下啊! 
Nach dem Login kopieren

<div id="append_parent" style="position: relative;">        <div id="zoomimglayer" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;            width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">            <img  id="zoomimg"   style="max-width:90%"                src="http://www.orico.com.cn/images/2013925141939458.jpg"  style="max-width:90%"  style="max-width:90%" alt="父元素相对定位后,子元素在ie下被覆盖的问题!_html/css_WEB-ITnose" >        </div>        <div id="zoomimglayer2" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;            width: 800px; height: 439px; cursor: pointer;background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);" class="popupmenu_popup">            <div id="dprev" title="上一张" style="position: absolute; left: 0; top: 20px; z-index: 1001;                cursor: pointer; width: 40%; height: 523px;" onclick="alert('上一张')">                <a style="top: 271.5px; position: absolute;" class="prev">上一张</a>            </div>            <!-- .main -->            <div id="dnext" title="下一张" style="position: absolute; right: 0; top: 20px; z-index: 1001;                cursor: pointer; width: 40%; height: 523px;" onclick="alert('下一张')">                <a style="position: absolute; top: 271.5px; right: 0;" class="next">下一张</a>            </div>        </div>    </div>
Nach dem Login kopieren

 
Nach dem Login kopieren
Nach dem Login kopieren

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage