Heim >Web-Frontend >HTML-Tutorial >html中元素动态生成导致重叠引起布局错乱_html/css_WEB-ITnose

html中元素动态生成导致重叠引起布局错乱_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:36:271788Durchsuche

写了一个页面如图   左上角的“运送至:”后面是个ul,其中的li时通过js触法onmouseover动态生成的,ul下面的那个多快好省是个html中元素动态生成导致重叠引起布局错乱_html/css_WEB-ITnose,全局padding:0 ;margin:0;出现问题是当动态生成ul时布局错乱如图  怎么解决?难道把布局改为position:absolute  设置z-index?这样不好吧


回复讨论(解决方案)

没有什么好不好的。只要能实现就可以。一般都是菜单hidden在一个元素中.用js控制display.这样可以不用position:absolute,

你自己分析说下

ul 和后面img的关系

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><title>open source</title><style type="text/css">body{margin:0;padding:0}#nav{        display:inline-block;        width:200px;        height:50px;line-height:50px;        background-color:#ddd;}        #nav_menu{background-color:#f1f1f1;margin:0;padding:0}</style></head><body><span id="nav">        shanghai        <ul id="nav_menu">                <li>Address</li>                <li>Email</li>                <li>Map</li>        </ul></span></body></html>


   

没有什么好不好的。只要能实现就可以。一般都是菜单hidden在一个元素中.用js控制display.这样可以不用position:absolute,



用display可以控制列表是否显示,但是显示列表之后还是会影响下面的布局呀。这个是要设置 z 值么?

   


没有什么好不好的。只要能实现就可以。一般都是菜单hidden在一个元素中.用js控制display.这样可以不用position:absolute,



用display可以控制列表是否显示,但是显示列表之后还是会影响下面的布局呀。这个是要设置 z 值么? 这个不一定。如果元素溢出可以不用z-index



   


没有什么好不好的。只要能实现就可以。一般都是菜单hidden在一个元素中.用js控制display.这样可以不用position:absolute,



用display可以控制列表是否显示,但是显示列表之后还是会影响下面的布局呀。这个是要设置 z 值么? 这个不一定。如果元素溢出可以不用z-index
我把上面列表设置position:absolute布局解决了这个问题。
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