一个简单的菜单,火狐下正常,IE下点击就乱了_html/css_WEB-ITnose
很少弄前端开发,这方面的知识也比较少。
<!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="/static/imghw/default1.png" data-src="images/zcts.png" class="lazy" 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="/static/imghw/default1.png" data-src="images/wlsg.png" class="lazy" 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="/static/imghw/default1.png" data-src="images/pay.png" class="lazy" 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="/static/imghw/default1.png" data-src="images/monery.png" class="lazy" 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="/static/imghw/default1.png" data-src="images/nohead.png" class="lazy" 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="/static/imghw/default1.png" data-src="images/msg.png" class="lazy" 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路径换个能显示的图片,就会有问题,

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

AI Hentai Generator
AI Hentai를 무료로 생성하십시오.

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











이 기사는 HTML & lt; Progress & Gt에 대해 설명합니다. 요소, 그 목적, 스타일 및 & lt; meter & gt의 차이; 요소. 주요 초점은 & lt; progress & gt; 작업 완료 및 & lt; meter & gt; Stati의 경우

이 기사는 HTML & LT; Datalist & GT에 대해 논의합니다. 자동 완성 제안을 제공하고, 사용자 경험을 향상시키고, 오류를 줄임으로써 양식을 향상시키는 요소. 문자 수 : 159

기사는 HTML5 크로스 브라우저 호환성을 보장하기위한 모범 사례에 대해 논의하고 기능 감지, 점진적 향상 및 테스트 방법에 중점을 둡니다.

이 기사는 HTML & lt; meter & gt에 대해 설명합니다. 범위 내에 스칼라 또는 분수 값을 표시하는 데 사용되는 요소 및 웹 개발의 일반적인 응용 프로그램. & lt; meter & gt; & lt; Progress & Gt; 그리고 Ex

이 기사에서는 브라우저에서 직접 사용자 입력을 검증하기 위해 필요한, Pattern, Min, Max 및 Length 한계와 같은 HTML5 양식 검증 속성을 사용하는 것에 대해 설명합니다.

이 기사는 모바일 장치의 반응 형 웹 디자인에 필수적인 Viewport Meta Tag에 대해 설명합니다. 적절한 사용이 최적의 컨텐츠 스케일링 및 사용자 상호 작용을 보장하는 방법을 설명하는 반면, 오용은 설계 및 접근성 문제로 이어질 수 있습니다.

이 기사는 & lt; iframe & gt; 외부 컨텐츠를 웹 페이지, 공통 용도, 보안 위험 및 객체 태그 및 API와 같은 대안을 포함시키는 태그의 목적.

GiteEpages 정적 웹 사이트 배포 실패 : 404 오류 문제 해결 및 해결시 Gitee ...
