首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

浏览器兼容性问题

1.浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。...碰到频率:100% 解决方案:CSS里 *{margin:0;padding:0;} 备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是...2.浏览器兼容问题五:图片默认有间距 问题症状:几个img标签放在一起的时候,有些浏览器会有默认的间距,加了问题一中提到的通配符也不起作用。...碰到几率:20% 解决方案:使用float属性为img布局 备注:因为img标签是行内属性标签,所以只要不超出容器宽度,img标签都会排在一行里,但是部分浏览器的img标签之间会有个间距。...(我的一个学生使用负margin,虽然能解决,但负margin本身就是容易引起浏览器兼容问题的用法,所以我禁止他们使用) 3. ie6.0横向margin加倍 产生因素:块属性、float、有横向margin

1.1K30

浏览器兼容性自查

Author: Codec.Wang Date: 2020/08/29 在解决浏览器兼容性问题或使用一些较新的 Web 技术时,经常需要查看各浏览器对 HTML/CSS/JS/SVG/Web/HTTP...以下是两种不错的自查方式: CanIUse https://caniuse.com/ 搜索关键字就会给出该特性在桌面和移动端主流浏览器中的兼容数据: 该特性在全球浏览器中支持 + 部分支持的比例,可以点击搜索栏旁边的设置来显示中国的数据...浏览器的当前版本,往上是旧版本,往下是未来的版本 详情浮窗:该版本的发布时间和使用率等,浏览器使用率数据来自 StatCounter 附加资源:很多实用的链接,比如该特性的规范定义、功能演示、不支持该特性时可使用的...Polyfill等等 MDN 在 MDN(Mozilla Developer Network) 上查看接口的相关资料时,一般都会在最后给出浏览器的兼容数据,如: https://developer.mozilla.org

1.5K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    减少浏览器兼容性问题

    做为一个前端工程师,不少时间都在处理浏览器兼容性问题。本文对如何减少浏览器兼容性问题的方法做了些总结。 确定运行环境 在开发前,我们要确定页面的运行环境:要兼容哪些浏览器,以及哪些屏幕分辨率。...查询特性的兼容性 在使用某个特性前,我们可以使用 Can I Use 来查询某特性在各个浏览器上的兼容性情况。也可以在代码中用 Modernizr 进行特性探测。...下面是一些查询兼容性的网站 es5规范浏览器兼容性表格 es6规范浏览器兼容性表格 html5 移动端兼容性速查 如果实在想用某个特性,但某个想兼容的浏览器不支持,可以找找有没库来做支持的 HTML5...所以我们要了解哪些写法会产生兼容性问题,然后避免那样写。 推荐认真研究浏览器兼容性-根本原因内容列表。 充分的测试 推荐使用 iTest。它是阿里出的测试工具。支持主流浏览器的截图,死链接检测等。...一些 CSS 属性记得要加浏览器前缀 有时页面的元素改变后,应该被重绘,但浏览器没有重绘,可以用让元素隐藏,然后再显示的方式来让浏览器重绘 拓展阅读 W3Help - 兼容性 - 根本原因内容列表 前端工程师如何系统地整理和累积兼容性相关的知识

    78920

    4种方案解决CSS浏览器兼容性问题

    前言 前端是一个苦逼的职业,不仅因为技术更新快,而且要会的东西实在太多了,更让人头疼的是,还要面临各种适配、兼容性问题。 ? 为什么会有浏览器兼容性问题? 还不是因为浏览器厂商太多了!...,对同一段CSS的解析效果也不一致,这就导致了页面显示效果不统一,也就带来了兼容性问题。...CSS浏览器兼容性问题的解决思路和方案 今天,不想去关注太多细节问题, 比如那个css样式需要我们去兼容,而是想讨论一下大的解决思路,主要包括4个方面,浏览器CSS样式初始化、浏览器私有属性,CSS hack...诸如:(+)与(#)之类的均可使用,不过业界对()的认知度更高 \9:选择IE6+ \0:选择IE8+和Opera15以下的浏览器 举例 如在不同的IE浏览器中设置不同的颜色,注意顺序:低版本的兼容性写法放到最后..., 并不能给我们技术上带来什么大的提升,无非是给各个浏览器厂商填坑罢了,随着时间的流逝,这些技术的价值也会越来越小,怎么花最小的力气解决css兼容性问题,让我们把更多的时间留给美好的生活,才是关键,好在有一些自动化插件可以帮我们从繁重的兼容性处理中解脱处理

    2.8K10

    介绍几款浏览器兼容性测试工具

    昨天和朋友聊到了有关浏览器兼容性的问题,在开发中有时的确很让人苦恼,我向他推荐了几款测试浏览器兼容的工具,分享给大伙,有什么更好的工具或是解决方法还希望大家拿出来晒一晒。 ?...IETester 这是我最先用的测试浏览器兼容性的工具,想必也是大家用的最多的一个,IETester是一个免费的Web浏览器调试工具,可以模拟出不同的js引擎来帮助程序员设计效果统一的代码。...可以方便的解决IE浏览器的兼容问题。 ?...根据微软的介绍,SuperPreview的可用IE版本视系统已安装IE浏览器的版本而定,如果系统安装了IE8,那SuperPreview浏览器测试可用版本就包括IE8、IE7和IE6;如果系统安装了IE7...不过,Microsoft Expression Web 3向所有浏览器敞开了大门,这里有篇不错的文章。大家可以了解下。

    3K10

    Ajax创建对象以及不同浏览器中的兼容性

    但是也有自身的缺点,Ajax大量使用javascript和Ajax引擎,这需要浏览器的支持。但是各个浏览器提供的创建Ajax的方式不同,使得我们需要测试各个浏览器兼容性,这一点比较麻烦。...3.创建Ajax对象XMLHttpRequest.由于各个浏览器的创建方式不同,所以我们写一个可以兼容各个浏览器的方法,在方法里我们实现各个浏览器中Ajax对象的创建。...在实现这个以前,我们先简单的分析一下,当前的浏览器分为IE浏览器((IE5.0 IE5.5 IE6.0, IE7 IE8))和非IE浏览器(按照W3C标准:FF Mozilla NetScape)两种,...但是呢IE浏览器的版本不同在创建Ajax的对象时也不相同,所以Ajax对象的创建种类比较多。...IE8) 6 if(window.XMLHttpRequest){ 7 request=new XMLHttpRequest();//非IE以及IE7,IE8浏览器

    1.1K40

    产品必懂技术术语:什么是浏览器兼容性

    比如同一个样式属性,在A浏览器支持,在B浏览器不支持。 浏览器兼容性从表现形式上可分为样式兼容性(css)和交互兼容性(javascript)。...兼容性问题解决方案 兼容性问题一般有2种解决方案,优雅降级和渐进增强。...比如有一个样式属性,在safari浏览器不支持,那么我们可以通过别的属性或结构来达到一样的视觉表现效果。 兼容性分类 浏览器兼容性从设备来分,又可以分为pc端兼容性和移动端兼容性。...PC端的兼容性只受windows和mac操作系统和固定的几个浏览器影响, 但是移动端还会被不同的手机厂商所影响,因为不同的手机厂商,手机内嵌的浏览器不一样,所以移动端需要解决的兼容性问题更多。...产品在提需求时,可以关注下这个产品的目标用户是哪些,目标用户使用的主流浏览器(pc端)或者主流机型(移动端)有哪些, 在写需求时建议写明需要兼容哪些机型(移动端),哪些浏览器(pc端),在需求验收时做好兼容性的功能验收

    81820

    Acid: 单网页检查页面,浏览器兼容性测试,浏览器好坏的标志

    典型的表现形式就是,一个浏览器中正常的网页,在另外一个浏览器中就变得不正常。...兼容性的一个核心问题就是浏览器如何对于网页进行排版,即如何渲染(Render)。但是,各个浏览器的开发者都更加愿意自己设定标准,这样浏览器一旦占领市场,就可以新来的竞争者设置障碍。...在这个网站面前,哪些浏览器和蔼可亲,哪些浏览器头上有角就变得一清二楚。这让用户选择有了一个直观的比较,让浏览器开发员有了一个明确的目标。...测试刚推出的时候,没有一个浏览器可以通过测试。下表是到目前(2009-06)为止的各主要浏览器测试成绩。...另外,在中国,目前使用最广的浏览器还是老旧的IE6,这是个连Acid2都没有通过的浏览器啊,无话可说。

    93840
    领券