`
liuting37
  • 浏览: 10205 次
  • 性别: Icon_minigender_2
社区版块
存档分类
最新评论

浏览器兼容性问题(内核、IEtester、cssrest、盒模型)

css 
阅读更多

浏览器兼容性问题(内核、IEtester、cssrest、盒模型)

一、浏览器内核

IETrident

火狐:Gecko

Chrome/safriwebkit

OperaPrestoOpera前内核已经被废弃,现在使用Blink

        Blink(googleOpera联合开发高版本用这个)

二、IEtesterbug

经常崩溃

当窗口大小改变的时候,页面内容可能会消失(作者改进中); 上一页/下一页功能不正常; Focus功能不正常; Java apple不能运行; Flash不能在IE6下正常运行。

三、浏览器初始化

 因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异。    当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化。*最简单的初始化方法就是: * {padding: 0; margin: 0;} (不建议)

四、盒模型

IE8以下的盒模型和W3C盒模型不同之处

IE8以下浏览器的盒模型中定义的元素的宽高不包括内边距和边框

//IE 在不加<!DOCTYPE html>头的时候会出现问题宽度会不包括padding,(IE11不再有此问题)

五、css遇到的兼容性问题

1 .IE6浮动 margin 产生的双倍距离

解决办法hack

<div style="float:left;width:200px;height:200px;background-color:pink;margin:200px;_margin-left:100px">

这个边距

</div>

或者displayinline

2.当子元素浮动未知高度时,使父容器适应子元素的高度bug
overflow:auto;-------让父容器自适应子元素的高度
_zoom:1;---------为了兼容IE6而使用的CSS Hack

3.图片下方有空隙产生给img元素添加属性:display:block;

4.Floatie6下,存在问题,float 会到下一行,不能和非float在一行内;

5.上一个元素为Float时会影响下一个元素的位置;

解决办法:css hack暴力设置值IE6下的margin-left值;或者将float用非float包起来。或者如果效果是让最下面一行占据一整行,要用clearboth

6.ie6 不显示boderdashed

 

分享到:
评论

相关推荐

    测试浏览器兼容性ietester

    标题“测试浏览器兼容性ietester”和描述提到了一个名为“ietester”的工具,它是一个用于测试浏览器兼容性的利器。下面将详细阐述浏览器兼容性测试的重要性、ietester的功能特点以及如何使用它来优化Web应用。 ...

    11款超赞的浏览器兼容性测试工具.docx

    本文介绍了11款超赞的浏览器兼容性测试工具,帮助开发者快速检测浏览器兼容性问题。 1. Superpreview:微软发布的跨浏览器测试工具,可以同时查看网页在多个浏览器的呈现情况,对页面排版进行直观的比较。该工具...

    浏览器兼容测试工具

    浏览器兼容性测试是Web开发过程中不可或缺的一环,因为不同的浏览器可能会有不同的解析标准和实现方式,导致同一段代码在不同浏览器中的表现不一致。为了解决这个问题,开发者通常需要借助各种浏览器兼容测试工具来...

    IETester-v0.4.7汉化版浏览器的兼容性

    **IETester-v0.4.7汉化版浏览器的兼容性** 在IT行业中,浏览器兼容性是一项至关重要的任务,特别是在网页设计、开发和测试领域。IETester是一款专为解决这一问题而设计的工具,它允许用户在同一个环境中测试不同...

    IE兼容性 调试工具 IETester

    IE兼容性 调试工具 IETester IE调试工具

    浏览器兼容性测试

    1. **CSS兼容性**:不同的浏览器对CSS属性的支持度不一,例如老版本的IE不支持CSS3的一些新特性,如圆角、阴影、渐变等。 2. **JavaScript兼容性**:新版本的JavaScript语法在旧版浏览器中可能无法运行,需要使用...

    七个能够帮助你进行网页浏览器兼容性测试的工具

    网页浏览器兼容性测试是网页开发过程中至关重要的一环,因为不同的浏览器可能会对HTML、CSS、JavaScript等Web技术有各自独特的解析和执行方式,导致在不同浏览器下显示效果各异。以下是一些能够帮助进行网页浏览器...

    IETester兼容测试工具

    在Web开发领域,浏览器兼容性问题一直是开发者们面临的一大挑战,特别是针对Internet Explorer(IE)浏览器,由于其不同版本之间的差异性较大,导致许多网站在新旧版本间可能存在显示或功能上的不一致。为了确保网站...

    IETester兼容性测试

    2006年发布的IE7是一个重要的升级,修复了许多IE6的兼容性问题,并增加了对CSS2.1和部分CSS3的支持,改进了盒模型。此外,IE7还增强了对XHTML和DOM Level 2的支持。然而,尽管比IE6有所进步,但IE7仍然存在一些兼容...

    IETester浏览器调试工具IE调试工具

    IETester是一款强大的网页开发者和前端工程师的必备工具,专为解决浏览器兼容性问题而设计。它集成了从Internet Explorer 5.5到最新版本的所有内核,使得用户可以在同一环境中测试网页在不同IE版本下的表现。这款...

    IE各版本浏览器测试软件 IETester(前端必备)

    通过对比不同版本的渲染结果,开发者可以找出可能导致问题的CSS样式、JavaScript代码或者其他兼容性问题。 **4. 解决兼容性问题的方法** 一旦发现问题,开发者可以通过以下几种方式来解决: - **调整CSS**:根据IE...

    ietester_4.12版

    总的来说,IETester 4.12版是一个针对Web前端开发者量身定制的浏览器兼容性测试工具,它通过模拟多种IE版本,帮助开发者解决在不同IE环境下可能出现的页面显示和功能异常问题。有了IETester,开发者可以更加专注于...

    IETester网页兼容性测试

    "IETester网页兼容性测试"工具就是为了解决这个问题而设计的。这款工具允许开发者在同一个环境中测试他们的网页在不同版本的Internet Explorer(IE)浏览器下的表现,从IE5.5到IE9,涵盖了多个重要的IE版本。 首先...

    网页前端开发工程师推荐的12款浏览器兼容性测试工具

    9. **Browsera**:自动检测网站的跨浏览器布局问题,帮助开发者发现并修复兼容性错误。 10. **WebDevLab**:专注于苹果Safari浏览器的测试,确保网站在Apple设备上的完美呈现。 11. **Litmus**:全面的测试工具,...

    ietester 测试不同浏览器

    由于IE浏览器历史上存在多个版本,并且每个版本的内核解析机制有所不同,这导致开发者在创建网页时常常会遇到跨版本兼容性问题。IETester就是为了帮助开发者解决这一问题而设计的。 **二、IETester功能** 1. **多...

    ietester.zip

    总的来说,IETester作为一款C#开发的浏览器兼容性测试工具,凭借其强大的功能和便捷的操作,已经成为开发者解决跨浏览器兼容问题的重要工具。通过深入理解和熟练运用IETester,我们能够确保网页和应用程序在各种环境...

    install-ietester 多版本IE页面测试

    - **CSS样式兼容性**:支持CSS层叠样式表的跨版本测试,帮助开发者发现和解决由于CSS兼容性问题导致的页面显示异常。 - **JavaScript和DOM支持**:对于每个IE版本,IETester都提供了相应的JavaScript引擎和文档对象...

    IETester 多浏览器测试利器

    2. **实时预览**:在IETester中,你可以实时看到代码更改对不同IE版本的影响,这对于快速修复兼容性问题非常有用。 3. **独立运行**:IETester作为一个独立的应用程序,不需要依赖于真实的IE浏览器安装,减少了系统...

    阿里巴巴开源的多浏览器兼容性测试解决方案 F2etest.zip

    F2etest 是一个面向前端、测试、产品等岗位的多浏览器兼容性测试整体解决方案。在之前,我们一般有三种解决方案:本机安装大量的虚拟机,一个浏览器一个虚拟机,优点:真实,缺点:消耗硬盘资源,消耗CPU资源,打开...

    IETester 网页制作人员必备的兼容测试工具

    - 开发者可以通过IETester检查浮动、定位、边框、背景、透明度等样式在各个版本中的表现,以及盒模型、CSS滤镜、CSS表达式等特性的兼容性问题。 3. **JavaScript兼容性**: - IETester同样适用于JavaScript的兼容...

Global site tag (gtag.js) - Google Analytics