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

 IEFireFox显示不一致

https://blog.csdn.net/huyuyang6688/article/details/38704045  IEFireFox显示不一致         在做新闻发布系统后台登陆界面时...于是代码中加了两个“ ”,FireFox达到预期效果了: ?         我们都知道,一个“ ”为一个字符大小。...可我明明已经“密码”二字中间添加了两个“ ”了,刚好为一个汉字的间距。但是IE浏览器测试的结果,“密码”二字中间的间距仍然很小(大约只有一个字符的大小)。...我继续添加“ ”,IE“密码”二字中间的间距不变,还是大约只有一个字符的大小,无论添加多少个 标记,好像最对只显示一个空格;而FireFox则乖乖地如数显示出所添加的空格长度。...第二种方法:浏览器改变字体,不过这好像是一种掩耳盗铃的做法→_→,咱们做出的程序是让大家用的 ,总不能让每个用户都去修改自己的浏览器吧,因此不建议采用这种方法来“蒙骗自己”。

1.2K30

彻底理解Doctype

写了很多年的CSS,但是对于页面的第一段话从来都是模模糊糊的认识。仿佛是记得,不同doctype模式,就会触发不同的验证级别。...,资料1不能够正常识别,但是笔者实验过后,发现在IE6Firefox3.5,即使使用strict模式,仍能够被正常解析为一个换行。...完整的doctype声明,要包括相应的文档类型定义(DTD)文件的URL。...浏览器对doctype声明的形式格式非常敏感,如果不能识别一个形式错误的doctype,就会强制进入Quirks模式(正是因为这个原因,所以我们建议将一个已知正确的doctype拷贝粘贴到文档,而不是亲自输入它...浏览器处理不能识别的doctype时,也存在不一致的现象。IEOpera会进入Standards模式;换言之,它假定不能识别的 doctype 是尚未在浏览器中集成的一个新标准。

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

你真的了解 browserslist 吗?一文彻底搞懂

关于 Browserslist 大家一定都不陌生,现有前端工程都会有它的身影。Browserslist 帮助我们浏览器兼容性包大小之间保持适当的平衡。...配置方式: 工程中使用 Browserslist 有两种常见方式:① package.json 相应字段增加;② 独立的 browserslistrc 文件 package.json 声明...只最新 Chrome 版本?还是要都兼容包括 IE11? caniuse-lite Can I Use 可以提供相应的数据支撑,Browserslist 也是依据此数据。...chrome 浏览器最新2个版本 特定浏览器版本 Chrome > 100 chrome 浏览器版本大于100 not Firefox ESR 排除 Firefox ESR 选择支持特定功能的浏览器版本...除此,你也可以通过下述工具,来检测配置是否正确支撑的具体浏览器版本。 如何检查配置是否正确

1.6K00

Web程序员们,你准备好迎接HTML5了吗?

9.firefoxIE的BOX模型解释不一致导致相差2px解决方法:div{margin:30px!...,只有文档严格地加上文档类型(DOCTYPE)声明,IE6才能够接受正确的box-model 所以,tantak的hack必须正确的DOCTYPE同时包含在文档才能够正常工作 div.content...important 这句放置另一句之上,上面已经提过。 其他: 注:IE都能识别*;标准浏览器(如Firefox,Opera,Netscape)不能识别*;IE6能识别*,但不能识别 !...important;*background:blue; //这一句会使Firefox,背景呈橙色,IE7为绿色,IE6为蓝色,道理前面一样,Firefox不能识别*,所以后面两句都不执行,直接执行第一句...important来hack,对于ie6firefox测试可以正常显示,但是ie7对!important可以正确解释,会导致页面没按要求显示!下面是三个浏览器的兼容性收集.

77020

网页设计另人头疼的浏览器兼容问题

9.firefoxIE的BOX模型解释不一致导致相差2px解决方法:div{margin:30px!...,只有文档严格地加上文档类型(DOCTYPE)声明,IE6才能够接受正确的box-model 所以,tantak的hack必须正确的DOCTYPE同时包含在文档才能够正常工作 div.content...important 这句放置另一句之上,上面已经提过。 其他: 注:IE都能识别*;标准浏览器(如Firefox,Opera,Netscape)不能识别*;IE6能识别*,但不能识别 !...important;*background:blue; //这一句会使Firefox,背景呈橙色,IE7为绿色,IE6为蓝色,道理前面一样,Firefox不能识别*,所以后面两句都不执行,直接执行第一句...important来hack,对于ie6firefox测试可以正常显示,但是ie7对!important可以正确解释,会导致页面没按要求显示!下面是三个浏览器的兼容性收集.

1.4K20

各浏览器对页面外部资源加载的策略

load事件尽可能早地触发。...然而,当我看到各浏览器实际的瀑布图时,我知道自己又犯了一个简单的错误:太过相信所谓的权威大众的声音,而没有更早地进行实践来检验理论的正确性…… 本篇文章就使用几种流行的浏览器,针对同一个页面的外部资源加载过程进行分析...测试的浏览器如下: IE6 IE8 Firefox3.6 Firefox4.0 beta12 Chrome 8 Opera 11 IE6 各资源按照在HTML中出现的顺序进行加载。...会分析HTML结构,优先下载scriptlink标签定义的外部资源。 Firefox3.6 IE8的几乎完全一样: 最大并发HTTP连接数为6个(可在about:config修改)。...鉴于Chrome对head部分的资源会独立加载,当head部分用不满6个HTTP并发数时,是否可以将资源移到body呢?body的资源又会引起其他的问题,需要谨慎考虑。

1.1K70

【自动化测试工具】QTPUFT入门

1.1、例如测试WEB时,可以从这个PDF文档里得出支持的组合如XPsp3+QTP11+IE8,Win7+UFT11.5+IE9,UFT11.53+Chrome30,不支持组合如QTP11+FireFox27...2.1、FireFoxChrome同样需要检查插件是否安装并启用。 FireFox附加组件-扩展应有Unified Functional Testing Extension。...4、如果仍不能识别,尝试关闭其他程序、关闭杀毒软件,先打开QTP后打开IE再识别。 第一个脚本: 1、打开QTP,加载Web add-in。...如果属性值一致,则触发WebButton对象的方法。 关于录制: 使用录制后可以看出录制自动完成了添加对象到对象库和在编辑区输入脚本(对象、方法参数)的过程。...5、Action1表输入多行数据,并修改脚本如下,注意脚本使用Global表时不同。 6、打开View菜单下的TestFlow。

1.9K20

javascript如何监听页面刷新和页面关闭事件

我们的日常生活,时常遇到这么一种情况,当我们点击一个链接、关闭页面、表单提交时等情况,会提示我们是否确认该操作等信息。...这里就给大家讲讲javascript的onbeforeunload()onunload()两个事件。 相同点: 两者都是在对页面的关闭或刷新事件作个操作。...(因为,unbeforeunload()是页面刷新之前触发的事件,而onubload()是页面关闭之后才会触发的)。 unbeforeunload()事件可以禁止onunload()事件的触发。...浏览器的兼容 onunload: IE6,IE7,IE8 刷新页面、关闭浏览器之后、页面跳转之后都会执行; IE9 刷新页面 会执行,页面跳转、关闭浏览器不能执行; firefox(包括firefox3.6...onbeforeunload: IE、Chrome、Safari 完美支持 Firefox 不支持文字提醒信息 Opera 不支持 IE6,IE7会出现bug ? 示例代码: ? ? ? ? ?

11.8K30

清除过的浮动

所以还是不要使用了 4)父元素设置 overflow:auto 属性 同样IE6需要触发hasLayout,演示3差不多 优点:不存在结构语义化问题,代码量极少 缺点:多个嵌套后,firefox...某些情况会造成内容全选;IE mouseover 造成宽度改变时会出现最外层模块有滚动条等,firefox早期版本会无故产生focus等, 请看 嗷嗷的 Demo ,不要使用 5)父元素也设置浮动...IE7 ,overflow 也变成了一个 layout 触发器: overflow: hidden|scroll|auto ( 这个属性IE之前版本没有触发 layout 的功能。 ...他们之前IE版本同样没有触发 layout 的功能) hasLayout更详细的解释请参见 old9翻译的 大名鼎鼎的 《On having layout》一文(英文原文:http://www.satzansatz.de...综上所述: 支持BFC的浏览器(IE8+,firefox,chrome,safari)通过创建新的BFC闭合浮动; 不支持 BFC的浏览器 (IE6-7),通过触发 hasLayout 闭合浮动。

83620

再谈BOMDOM(5):各个大流浪器DOMBOM里面的那些坑—兼容性

pageX/Y获取到的是触发点相对文档区域左上角距离,以页面为参考点,不随滑动条移动而变化 问题二:IE ,event 对象有 x, y 属性(事件发生的位置的 x 坐标 y 坐标)火狐没有。...getAttribute IE是不认识class属性的,需改为className属性,同样,Firefox,也是不认识className属性的,Firefox只认识class属性,所以通常做法如下...('box').getAttribute('className');//非 IE 不支持 PS: IE7 及更低版本的IE浏览器,使用 setAttribute()方法设置 class  style...event.srcElement : event.target; innerText的问题 innerTextIE能正常工作,但是innerTextFireFox却不行。...oninput是onpropertychange的非IE浏览器版本,支持firefoxopera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效

93740

CSS-各种cs样式之浏览器兼容处理方式汇总大全(更新...)

display: inline-block;/* firefox等标准浏览器识别*/ *display: inline;/* 只有ie6ie7识别*/ *zoom: 1;/* 触发ie6...总结就是:我自己当前版本的页面少写了一个:.clearfix { *zoom:1;} 结果就导致ie姥爷的难受 涉及到浮动的地方都会正常浏览器不一致。。。。 看来这不能省啊。...缺点是要控制内容不要换行 7、cursor: pointer 可以同时 IE FF 显示游标手指状, hand 仅 IE 可以 8、FF: 链接加边框背景色,需设置 display: block,...参照 menubar, 给 a menubar 设置高度是为了避免底边显示错位, 若不设 height, 可以 menubar 插入一个空格。...9、mozilla firefoxIE的BOX模型解释不一致导致相差2px解决方法: div{margin:30px!

1.6K50

前端必看!各大浏览器 CSS Hack 收集

可以识别,所以此样式IE6实际设置对象的宽度为200px,后面的把前面的给覆盖了,而其他浏览器不识别_width不会执行_width:200px;这句样式,所以在其他浏览器设置对象的宽度就是300px...2、CSS hack解决问题 CSS hack用来解决有些css属性不同浏览器显示的效果不一样的问题,如margin属性ie6显示的距离会比其他浏览器显示的距离宽2倍,也就是说margin-left...:20px;ie6距左侧对象的实际显示距离是40px,而在非ie6显示的距左侧对象的距离是设置的值20px;所以要想设置一个对象距离左侧对象的距离在所有浏览器中都显示是20px的宽度的样式应为:....系列浏览器可读「9」,而IE6IE7可读「*」(米字号),另外IE6可辨识「_」(底线),因此可以依照顺序写下来,就会让浏览器正确的读取到自己看得懂得CSS语法,所以就可以有效区分IE各版本IE浏览器...important」,至于Firefox可以读取「!important」但不能辨识「*」因此可以透过这样的差异来有效区隔IE6、IE7、Firefox

1.6K130

8 款浏览器兼容性测试工具介绍,需要的赶紧收藏吧!

- IE11),最新测试版开发版(Edge,Safari,Chrome,Firefox,Opera Yandex)以及各种真实的 iOS Android 设备。...5、LambdaTest 网址:https://www.lambdatest.com/ 作为一款基于云的自动化跨浏览器测试平台,LambdaTest 提供了 2000 多种浏览器操作系统的组合,确保网页在所有主要浏览器...不仅是 Chrome 上,这个插件还在 Firefox、Safari、Internet Explorer、Edge、Android Chrome iOS Safari 上截图。...您可以针对数十种浏览器真实的设备开展 Web 应用测试,并获得即时的结果。支持 Chrome、Firefox、Safari、Edge、IE、Windows、OSX、iOS 等。...也可以真实的设备浏览器上,运行各种 Selenium Appium 类型的脚本。可免费试用。

5K30

文档类型渲染模式

怪癖模式下,浏览器会模拟Navigator 4IE5的方式来渲染页面。标准模式下,浏览器会用HTMLCSS规范定义的方式来渲染页面。...准标准模式下,浏览器少数部分情况下用怪癖模式来渲染。 不同浏览器的怪癖模式也是不一样的。IE 6,7,8的怪癖模式模拟IE5.5。在其他浏览器,怪癖模式是对准标准模式的少量偏移。...内容类型为application/xhtml+xml,Firefox、Safari、ChromeOpera,application/xhtml+xml HTTP内容类型会触发XML模式。...XML模式,浏览器尝试给XML文档规范上的正确处理达到制定浏览器的程度。 IE6、78不支持application/xhtml+xml,Mac IE5也如此。...firefox安装了webDeveloper插件后,可在webDeveloper工具条的最右边查看。 ie可打开开发人员工具查看(快捷键F12)。 何时会触发怪癖模式 缺少文档声明。

67120

CSS兼容性的一些Hack方法

important;color:green; 棕色 N N Y N Y N Y N Y Y 说明:标准模式 “-″减号是IE6专有的hack “\9″ IE6/IE7/IE8/IE9/IE10都生效..., IE7显示为:黑色, IE8显示为:红色, IE9显示为:蓝色, Firefox/Chrome显示为:橘色, (本例IE10效果同IE9,Opera最新版效果同IE8) */ background-color...Firefox/Chrome的hack,注意顺序 IE6显示为:红色, IE7显示为:蓝色, IE8显示为:绿色, IE9显示为:粉色, Firefox/Chrome显示为:橘色, (本例IE10效果同...demo2实例是用于区分标准模式下ie6~ie9Firefox/Chrome的hack,注意顺序 IE6显示为:绿色, IE7显示为:黑色, IE8显示为:红色, IE9显示为:蓝色, Firefox.../Chrome显示为:橘色, (本例IE10效果同IE9,Opera最新版效果同IE8) demo3实例也是用于区分标准模式下ie6~ie9Firefox/Chrome的hack,注意顺序 IE6显示为

1.1K30
领券