zoukankan      html  css  js  c++  java
  • 浏览器兼容性问题解决方案之CSS,已在IE、FF、Chrome测试

    当前主浏览器的核心是什么?

            1) Trident:IE浏览器使用的内核,该内核程序在1997年的IE4中首次被采用,是微软在Mosaic代码的基础之上修改而来的,并沿用到目前的 IE7。Trident实际上是一款开放的内核,其接口内核设计的相当成熟,因此才有许多采用IE内核而非IE的浏览器涌现(如 Maxthon、TheWorld 、TT、GreenBrowser、AvantBrowser等)。

            2) Geckos: Netcape6开始采用的内核,后来的FF也采用了该内核,Geckos的特点是代码完全公开,因此,其可开发程度很高,全世界的程序员都可以为其编写代码,增加功能。

            3) Presto:目前Opera采用的内核,该内核在2003年的Opera7中首次被使用,该款引擎的特点就是渲染速度的优化达到了极致,也是目前公认网页浏览速度最快的浏览器内核,然而代价是牺牲了网页的兼容性。

            4) Webkit:Safari浏览器使用的内核。Google的Chrome浏览器也是采用Webkit。Webkit引擎包含WebCore排版引擎及 JavaScriptCore解析引擎,均是从KDE的KHTML及KJS引擎衍生而来,它们都是自由软件,在GPL条约下授权,同时支持BSD系统的开 发。所以Webkit也是自由软件,同时开放源代码。在安全方面不受IE、Firefox的制约,所以Safari浏览器还是比较安全的浏览器。

    我整理的一些实例,都是在谷歌、IE7、IE8、IE9、IE10、FF中测试过。

    实例:

    1) 隐藏浏览器的滚动条

    问题:

           隐藏浏览器的滚动条

    解决:

          1) 只有ie7支持<bodyscroll="no">

          2) 除ie7不支持body{overflow:hidden}

          3) 所有浏览器html{overflow:hidden}

    实例:

             1) 只有ie7支持<body scroll="no">

    <span style="font-size:18px;">           <body scroll="no" ></body></span> 

      2)除ie7不支持 body{overflow:hidden}

        <span style="font-size:18px;">           <body style="overflow:hidden" ></body></span>  

     3) 所有浏览器 html{overflow:hidden}

    <span style="font-size:18px;">           <body style="overflow:hidden" ></body></span>

    超链接访问过后hover样式不出现的问题

    问题:

           点击超链接后,hover、active样式没有效果

    解决:

           改变CSS属性的排列顺序:L-V-H-A  

        <style type="text/css">  
        a:link {color: #FF0000}     /* 未访问的链接 */  
        a:visited {color: #00FF00}  /* 已访问的链接 */  
        a:hover {color: #FF00FF}    /* 当有鼠标悬停在链接上 */  
        a:active {color: #0000FF}   /* 被选择的链接 */  
        </style>  

    li中的内容以省略号显示

    问题:

           li中内容超过长度时,想以省略号显示,此方法适用于ie7、8、9、10,谷歌,ff浏览器

    li{  
    list-style-type:none;  
    width:200px;   
    white-space:nowrap;  
    text-overflow:ellipsis;   
    overflow: hidden;   
     } 

    使连续长字段自动换行

    div    
    {         
    width:300px;         
    word-wrap:break-word;       
    border:1px solid red; }
  • 相关阅读:
    TypeScript 里的 module 概念
    SAP Spartacus Definition of Done
    SAP Commerce Cloud 新一代 UI Spartacus 和 Customer Data cloud 的集成
    关于 SAP Spartacus 和 SmartEdit 集成的问题
    Linux Boot,Kernel 和 Service 介绍
    Linux 的发展历史,设计哲学和一些常用的术语介绍
    SAP Fiori Elements 公开课第三单元学习笔记
    SAP Fiori Elements 公开课第二单元视频的台词和课程主要内容
    SAP Fiori Elements 公开课第二单元学习笔记:Fiori Elements 架构
    qt-事件处理的方式
  • 原文地址:https://www.cnblogs.com/yeminglong/p/3925686.html
Copyright © 2011-2022 走看看