一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 12:16:53902浏览
很少弄前端开发，这方面的知识也比较少。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title></title><style type="text/css">.menus { float:left; width:98%; margin-bottom:0px; height:50px; background-image:url(images/qiannan.png);}#navs { margin-top:0px; text-align:center;}#navs li { display: inline; text-align:center; vertical-align:middle; list-style-type: none;}#navs li a { display:block; padding:15px 0px 0px 20px; margin-left:-40px; margin-right:40px; text-align:center; color:#fff; font-size:18px; font-family:arial; font-weight:900; height:35px; text-decoration:none;}#navs li a:link,#nav li a:visited { float:left; padding-right:20px; text-align:center; vertical-align:middle;}#navs li a:hover { background-color:#2c58ae; color:#E0ECFF;}.onclicks { background-color:#E0ECFF; color:#416AA3; }</style></head><body> <div style="height:32px; background-image:url(images/shengnan.png);"> <div id="saturday" style="height:50px; width:100%; background-image:url(images/qiannan.png); float:left; margin-top:0px;"> <ul id="navs"> <li><a href="#" value="arbitration/arbitration_directory.html"> <img src="images/zcts.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >a</a></li> <li><a href="#" value="left_materialSubscribe.html"> <img src="images/wlsg.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >b</a></li> <li><a href="#" value="left_alipay.html"> <img src="images/pay.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >c</a></li> <li><a href="#" value="left_alipay.html"> <img src="images/monery.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >d</a></li> <li><a href="#" value="left_alipay.html"> <img src="images/nohead.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >e</a></li> <li><a href="#" value="left_alipay.html"> <img src="images/msg.png" style="max-width:90%" style="max-width:90%" style="float:left; margin:-7px 5px 0px 0px;" alt="一个简单的菜单，火狐下正常，IE下点击就乱了_html/css_WEB-ITnose" >f</a></li> </ul> </div> </div> </body></html> 上面代码在火狐运行是正常的，在IE不行，请问要怎么改下都兼容？只需要兼容IE8就行了
回复讨论(解决方案)
没发现IE8有什么问题 你的li是横排的么
a 定义成了block 而没有宽度 在ie6就应该会有问题
IE8和firefox效果一样....
没发现IE8有什么问题 你的li是横排的么
a 定义成了block 而没有宽度 在ie6就应该会有问题
这是用firefox 与 IE 8 打开后的页面，看上去都没什么问题
当点击这个菜单中的b的时候
IE乱了：
Firefox正常:
IE8和firefox效果一样.... 看样子是我表述有问题了，是点击这个菜单后，IE下乱了，第一次访问不点击都显示正常。
是不是你的原始代码点击还会做什么事情 但你现在给的代码点击是没什么反应的啊
是不是你的原始代码点击还会做什么事情 但你现在给的代码点击是没什么反应的啊
我就是直接用这上面的代码，没有其他引用，直接运行，IE点击就变了，li标签不再保持一行，换成了很多行
是不是你的原始代码点击还会做什么事情 但你现在给的代码点击是没什么反应的啊
这里的images路径换个能显示的图片，就会有问题，
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn