人人网 - 抱歉
哦，抱歉，好像看不到了
现在你可以:
看看其它好友写了什么
北京千橡网景科技发展有限公司：
文网文[号··京公网安备号·甲测资字
文化部监督电子邮箱：wlwh@··
文明办网文明上网举报电话： 举报邮箱：&&&&&&&&&&&&3272人阅读
{*rule !important}这个css规则当今在网页制作的时候的普及已经非常流行了，以前我对它的理解就停留在‘浏览器是否识别阶段’ 而没有真正去研究过，可是现在发生了变化。众所周知，!important这个规则对Ie6.0,Ie7.0和Firefox能写hack，现在就来讲解 这是什么原理：
　　*对于Ie系列浏览器都能够识别， firefox 浏览器则不能识别;
　　!important只有Ie7.0和firefox可以识别，但是Ie6.0不能成功应用.
　　(1)区别ie与firefox的hack为:border:2px solid #f00;*border:1px solid #f00;
&&&& (2)区别Ie6.0 与Ie7.0、firefox的hack为:border:1px solid #f00!border:2px solid #f00;
　　在(1)中，之所以把*放在后面是因为ff不识别*而导致只对它设置了一次而ie 系列进行了两次border设置后，后一个属性覆盖了前一个属性，故为一像素的边框。
　 　在(2)中，之所以把!important放在第一个border 设置，是因为它把这次border的优先级提高了，即使后面在一次甚至在N次设置border 也无效，但是Ie6.0对这个规则不接受，而导致它应用了第二次的border 设置，也就是第二次覆盖了第一次的这一原理， 并不是它不识别!所以它的border为2 像素的红框.
首先我们说说firefox和IE对CSS的宽度显示有什么不同：&
　　其实CSS&’width’&指的是标准CSS中所指的width的宽度，在firefox中的宽度就是这个宽度。它只包含容器中内容的宽度。而Internet&Explorer&’width’则是指整个容器的宽度，包括内容，padding&，border。&
Firefox中：容器占的宽度=内容宽度+padding宽度+border宽度&
IE中：内容宽度=您定义的容器宽度(Internet&Explorer&’width’)-padding宽度-border宽度&
　　所以，如果IE中定义&width:120padding:5px&的话，所显示的宽度就是120px.&
　　即padding:5px是在width里面。&
　　而Firefox中，上面这个定义，显示宽度就是&130&
　　所以，我们就必须这样定义&
width:115px&!width:120padding:5
　　必须注意的是，&!&一定要在前面。&
例如:&p style=&padding-top:50*padding-top:30;_padding-top:20&&我们&/p&
解释下上面代码;*表示所有IE浏览器可识别;_表示只有IE6可以识别;不写表示所有浏览器识别;(+好象意思是只对IE7浏览器识别,这个我忘了,不确定,你可以自己试试)用这样的办法来微调达到浏览器之间的一致.这办法可以对些小问题得到很好的帮助
主要还是要扎实基本功,以后你会了解到更多好的解决你问题的办法
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：109478次
积分：1782
积分：1782
排名：第14207名
原创：60篇
转载：71篇
评论：11条
(2)(1)(2)(1)(4)(4)(7)(4)(4)(13)(1)(2)(2)(6)(1)(2)(5)(8)(1)(6)(2)(11)(9)(15)(3)(2)(2)(7)(4)Javascript同时兼容IE和FIREFOX的一些注意点
我们在使用Javascript时候，经常会出现不能同时兼容IE和FIREFOX现象，很多站长或者网站开发人员很容易忽略这点，一般在测试的时候只考虑到界面的显示兼容，而对程序的实际运行情况缺乏应有的测试。这里特别精简汇总一下Javascript的相关兼容性问题，提醒站长们注意。Javascript获取文档对象相关注意问题1、表单内对象：document.form1.item(&abc&)用法不能兼容FIREFOX，只对IE有效，正确用法是document.form1.element[&abc&]。2、Document文档对象ID：在IE中可以直接作为document的下属对象变量使用，在FIREFOX上则有问题，解决方法用getElement(&abc&)代替直接使用ID名取用对象。3、集合类对象：集合类对象的取用方法：document.form1(&abc&)应当改为document.form1[&abc&]，document.getElementByName(&abc&)应当改为document.getElementByName[&abc&]4、获取其它element建议使用getElementById或者getElementByTagName。5、获取父节点建议使用parentNode来获取，可以同时兼容IE和FF。window event事件相关注意问题：1、window.event只对IE有效，无法在FIREFOX上运行，正确用法，使用带参数的函数调用，如&input type=&button& name=&Submit1& value=&提交& onclick=&chksubmit(event)&/&&script language=&javascript&&function chksubmit(evt){evt=evt?evt:(window.event?window.event:NULL);//根据实际是否传值进来判断浏览器类型，进而选择性赋值EVENT对象....}&/script&2、event.x和event.y的问题，必须使用ex=event.x?event.x:event.pageX;ey=event.y?event.y:event.pageY;根据实际运行情况选择，选择项的前者是IE支持，后者为FIREFOX支持。操作获取IFRAME的相关注意问题：在IE可以通过FRAME的ID和NAME都可以访问IFRAME对象，但是FIREFOX只能通过NAME属性访问，最好的方法把IFRAME的名字和ID设为相同值，就可以使用window.top.frameName或window.top.frameId来访问，反正两者设相同值，运行起来效果一样。或者也可以统一直接使用window.top.getElementById(&frameId&)形式获取。setAttribute和getAttribute：在IE上使用setAttribute和getAttribute对class进行设置时候，会无效，但是FIREFOX上可以。比如obj.setAttribute('class',&Open&);，区别如下：IE必须使用：obj.setAttribute('className',&Open&);FF必须使用：obj.setAttribute('class',&Open&);兼容可以写上以上两种或直接改成obj.className=&Open&;形式。getElementsByNamegetElementsByName按照w3c标准是按name属性进行查询的，在IE上则是按照id属性进行查询，可以通过为元素同时增加name和id属性进行兼容。Javascript兼容IE和FIREFOX的其它注意事项：1、IE要与FIREFOX兼容JAVASCRIPT，要尽量不要让变量名与控件ID名相同，非得相同也要记得为变量加上var声明才可以；2、不要使用const声明变量，因为IE不支持const，用var就可以了；3、URL地址书写中最好不要使用&amp，建议直接使用&，这是由于遵守规范的兼容性问题决定的，建议实际使用测试一下；4、在使用nodeName和tagName时候，一定记得判断是否为空，推荐使用tagName；
相关文章:&&
相关评论（0）:&&
邮箱(选填)
主页(选填)
记住我,下次回复时不用再次输入个人信息
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。当前访客身份：游客 [
这个人很懒，啥也没写
目前还没有任何评论
今日访问：0
昨日访问：0
本周访问：0
本月访问：1
所有访问：982
Firefox与IE浏览器缓存的两个重要区别
发表于3年前( 15:30)&&
阅读（144）&|&评论（）
0人收藏此文章,
详细介绍了firefox的缓存与IE的区别,如何设置服务响应头让两者缓存行为一致.
当你建立好一个WEB服务后,通常有两个类型的缓存需要配置:
设置网站有更新的时候html资源马上过期,以便正在浏览的用户可以很快地得到更新.
设置所有其它资源(例如图片,CSS,javascript脚本)在一定时间后过期.
这个缓存方案涵盖文章中提到关于如何处理更新的一些思想.
现在支持Firefox了,我们想探讨一下Firefox在处理缓存上与IE有些什么不同.设置较长过期时间的使用方式(上面第二条)仍可以直接用于Firefox,但配置1在两者之间还是存在细微差别的.
在 中,我们把第一条划分为:
某些时候动态HTML页面需要即时从服务器更新以备随时显示-甚至是使用后退按钮的时候.例如,显示银行帐号的状态或在线订单.
静态HTML页面,比如联系,FAQs或者站点地图等页面,如果它们设置了Last-Modified响应头,允许浏览器在需要的时候重新校验,就可以利用到缓存.
本文剩下部分探讨了Firefox中影响HTML页面缓存的两个重要不同点.
1. 使用no-cache防止Firefox缓存无效
你可以简单地设置如下的响应头预防IE缓存任何东西:
Cache-Control: no-cache
使用了这个响应头的页面不会保存在缓存里,IE总会重新从服务器加载;即使你使用后退按钮.下面这个例子使用HttpWatch监听一个网上商店,当我们在提交订单表单后点击后退按钮,结果如下图:
然而,这个响应头却不能防止Firefox的缓存.这意味着,Firefox在正常访问的情况下,将一直使用缓存的页面,直到它发送GET请求重新检验.并且,如果是通过后退按钮访问页面,Firefox不会再次访问服务器,而是简单直接地从缓存加载.
那怎样才能关掉Firefox中的缓存呢? 答案很简单,关不了. 因为Firefox依靠缓存中的副本为&文件-&另存为&,&查看源代码&这样的操作服务.但是,你可以控制页面缓存到哪里及那些缓存条目可以用于显示.
下面响应头在Firefox中可以防止持久化的缓存,强制页面被缓存到内存中:
Cache-Control:no-store
这个头也可以防止使用后退按钮时访问了缓存页面,它将触发一个HTTP GET请求.
这两个响应头的值组合使用可以在IE与Firefox得到期待的结果:
Cache-Control: no-cache, no-store
如下HttpWatch响应头标签所示:
2. 如果没有设置过期时间Firefox会为你设置一个
当IE遇到没有Expires头的http响应时,它就认为永远不能自动使用缓存条目,直到它重新从服务校验.由于IE的临时文件的一个设置项&检查所在网页的较新版本&默认为&自动&,所以通常都是一个会话做一次.
这就为控制静态的html内容的缓存提供了一个合理的方式.用户新打开的IE会得到html的最新版本,而缓存的版本就在关闭IE前会一直被使用.
Firefox处理缺失Expires头的方式不同.如果影响中有Last-Modified头它就会使用HTTP 1.1规范RFC2616中指定的一个尝试性的过期值:
(引用规范:) 并且,如果响应中有Last-Modified时间值,尝试性的过期值不能超过这个值到现在时间间隔的一个比率,一般设置这个比率为10%.
计算方式如下:
过期时间 = 现在时间 + 0.1 * (Last-Modified到现在的时间差)
例如,如果你的静态HTML文件上次修改时间是100天前,那过期时间就是10天之后.下面的示例是一个没有Expires头页面的HttpWatch缓存标签:
Firefox自动设置了过期时间为8天后,因为这个页面大概80天没有被修改过了.
这意味着,为了保持控制好你的HTML页面,正如我们在
文章中讨论过的,你最好为你的静态资源如HTML,图片,CSS文件等,在你的WEB服务器设置一个合适的Expires值.
为了确保IE与Firefox的缓存行为一致,你应该:
总是指定一个Expires头. 一般设置-1使用html页面能即时刷新或者对其它如图片,CSS,javascript脚本资源设置一个特定的过期时间
如果你要强制页面刷新,甚至是点击后台按钮的时候,那就设置 Cache-Control: no-cache, no-store
更多开发者职位上
1)">1)">1" ng-class="{current:{{currentPage==page}}}" ng-repeat="page in pages"><li class='page' ng-if="(endIndex<li class='page next' ng-if="(currentPage
相关文章阅读