> 웹 프론트엔드 > HTML 튜토리얼 > 这是要逆天啊。浏览器不兼容的一个问题_html/css_WEB-ITnose

这是要逆天啊。浏览器不兼容的一个问题_html/css_WEB-ITnose

WBOY
풀어 주다: 2016-06-24 12:09:55
원래의
1020명이 탐색했습니다.

问题就是在firefox,ie8里页面底部的文字和背景图会灵异的跑到最顶端,在导航条之上。。。实在是想不出为什么。。拜托各位了!!


首先,html代码:是模板页的



    深圳网能达公司
      
      <script></script>
      <script> <br /> $(function(){ <br /> $menuLi = $(".menu>ul>li"); <br /> $menuLi.hover(function() { <br /> $(this).addClass("selected"); <br /> },function(){ <br /> $(this).removeClass("selected"); <br /> }) <br /> }) <br /> </script>
      
       



    

    

        

          

              
  • 这是要逆天啊。浏览器不兼容的一个问题_html/css_WEB-ITnose
  •     
              

        

            

                

                        
  • 首页
                        

  •                     
  • 关于网能达
                            
    • 公司简介

    •                         
    • 企业文化

    •                         
    • 咨询反馈

    •                         
    • 进入后台

    •                         

                        

  •                     
  • 公司动态
                            

                              
    • 发展进程

    •                         
    • 未来规划

    •                         

                        

  •                     
  • 产品介绍
                            

                              
    • 产品展示

    •                         
    • 资质证书

    •                         

                        

  •                     
  • 商务合作
                            

                              
    • 合作信息

    •                         
    • 联系方式

    •                         

                        

  •                     
  • 加入网能达
                            

                              
    • 招聘信息

    •                         
    • 招聘电话

    •                         

                        

  •                 

            


        

            
            

        

        
   

   

        
  • Copyright © 2012深圳市网能达科技有限公司 All rights reserved 

        

    




css:

body {text-align:center;background-repeat:no-repeat; width:990px; margin:0 auto; padding:0px;  background:url(../images/body_sky.jpg) no-repeat;}
div,form,ul,ol,li,span,p{ border:0px; padding:0px; margin:0px; font-size:12px;list-style:none;}
ul,ol,li{list-style:none}
a{color:Black; text-decoration:none;}
a:hover{color:Red;}
img{ border:none;}

.xbody{width:990px; text-align:left; margin:0 auto; height:95%;}
.head{height:100px; }
.head li{ float:left;}
.for{position: relative; left:900px; top:70px; font-size:16px; font-style:italic; font-weight:bolder;}




.menu{width:990px; float:left; display:inline; height:30px; background-image:url(../images/bar.gif); margin:10px auto;}
.menu ul,.menu li{float:left; display:inline; position:relative;}
.menu li a,.menu li a:hover{display:block; float:left; line-height:30px; width:160px; text-align:center; color:#FFF; font-size:14px;}
.menu li.selected a,.menu li a:hover{background:#008000; font-weight:bold; color:#00F;}
.menu ul li ul{position:absolute; left:0px; top:30px; display:none; width:160px;}
.menu ul li.selected ul{display:block;}
.menu li.selected li a,.menu li.selected li a:hover{background:#4490CE; color:#000; font-weight:normal;}
.menu li.selected li a:hover{background:#000; color:#FFF;}

.footer
{  
 text-align:center;
     background-image:url(../images/foot_bg.jpg);
   
}


回复讨论(解决方案)

你在footer上面加个float:left

你在footer上面加个float:left 跪谢Q立竿见影。。。不知大师能解释下否?

应该是上面的层有浮动的,所以影响到了他你如果给footer加上个clear:both应该也没问题的

应该是上面的层有浮动的,所以影响到了他你如果给footer加上个clear:both应该也没问题的 再一次帮到我了

我想说加了.clear{clear:both 好像也还是没用哦

css不全页面看得很痛苦...大致是浮动没有清除的原因.


  

      
  • 这是要逆天啊。浏览器不兼容的一个问题_html/css_WEB-ITnose
  •   



style="max-width:90%"/>

这两行的高度不一致~ 这个在兼容方面造成错误的~

另一个方面~
  


  
  • Copyright © 2012深圳市网能达科技有限公司 All rights reserved 

  


加个清理就好了~

大哥,我是分离样式和页面文件的写法,在你样式文件的写.clear{clear:both}然后在页面文件里面引用


直接加就要这样写

我想说加了.clear{clear:both 好像也还是没用哦
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿