﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>BlogJava-JAVA EE藏经阁-随笔分类-Web前端</title><link>http://www.blogjava.net/qchong/category/36189.html</link><description /><language>zh-cn</language><lastBuildDate>Wed, 24 Feb 2010 01:33:31 GMT</lastBuildDate><pubDate>Wed, 24 Feb 2010 01:33:31 GMT</pubDate><ttl>60</ttl><item><title>[CSS HACK]IE6、IE7、IE8、Firefox兼容性问题</title><link>http://www.blogjava.net/qchong/archive/2010/02/24/313759.html</link><dc:creator>Jarvis</dc:creator><author>Jarvis</author><pubDate>Wed, 24 Feb 2010 01:17:00 GMT</pubDate><guid>http://www.blogjava.net/qchong/archive/2010/02/24/313759.html</guid><wfw:comment>http://www.blogjava.net/qchong/comments/313759.html</wfw:comment><comments>http://www.blogjava.net/qchong/archive/2010/02/24/313759.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/qchong/comments/commentRss/313759.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/qchong/services/trackbacks/313759.html</trackback:ping><description><![CDATA[<strong>1.区别IE和非IE浏览器
</strong>
<div>
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">blue</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*非IE</span><span style="color: #008000; ">&nbsp;背景藍色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">red&nbsp;\9</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6、IE7、IE8背景紅色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
</div>
<strong><br />
2.区别IE6,IE7,IE8,FF
</strong>
<div>【区别符号】：「\9」、「*」、「_」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">blue</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">Firefox&nbsp;背景变蓝色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">red&nbsp;\9</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE8&nbsp;背景变红色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">black</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变黑色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
_background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：因为IE系列浏览器可读「\9」，而IE6和IE7可读「*」(米字号)，另外IE6可辨识「_」(底线)，因此可以依照顺序写下来，就会让浏览器正确的读取到自己看得懂得CSS语法，所以就可以有效区分IE各版本和非IE浏览器(像是Firefox、Opera、Google Chrome、Safari等)。</div>
<strong><br />
3.区别IE6、IE7、Firefox (方法 1)
</strong>
<div>【区别符号】：「*」、「_」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">blue</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">Firefox背景变蓝色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">black</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变黑色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
_background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：IE7和IE6可读「*」(米字号)，IE6又可以读「_」(底线)，但是IE7却无法读取「_」，至于Firefox(非IE浏览器)则完全无法辨识「*」和「_」，因此就可以透过这样的差异性来区分IE6、IE7、Firefox
</div>
<strong><br />
4.区别IE6、IE7、Firefox (方法 2)
</strong>
<div>【区别符号】：「*」、「!important」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">blue</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">Firefox&nbsp;背景变蓝色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">green&nbsp;!important</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变绿色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：IE7可以辨识「*」和「!important」，但是IE6只可以辨识「*」，却无法辨识「!important」，至于Firefox可以读取「!important」但不能辨识「*」因此可以透过这样的差异来有效区隔IE6、IE7、Firefox。</div>
<strong><br />
5.区别IE7、Firefox
</strong>
<div>【区别符号】：「*」、「!important」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">blue</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">Firefox&nbsp;背景变蓝色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">green&nbsp;!important</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变绿色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：因为Firefox可以辨识「!important」但却无法辨识「*」，而IE7则可以同时看懂「*」、「!important」，因此可以两个辨识符号来区隔IE7和Firefox。</div>
<strong><br />
6.区别IE6、IE7 (方法 1)
</strong>
<div>【区别符号】：「*」、「_」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
*background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">black</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变黑色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
_background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：IE7和IE6都可以辨识「*」(米字号)，但IE6可以辨识「_」(底线)，IE7却无法辨识，透过IE7无法读取「_」的特性就能轻鬆区隔IE6和IE7之间的差异。</div>
<strong><br />
7.区别IE6、IE7 (方法 2)
</strong>
<div>【区别符号】：「!important」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">black&nbsp;!important</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE7&nbsp;背景变黑色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：因为IE7可读取「!important;」但IE6却不行，而CSS的读取步骤是从上到下，因此IE6读取时因无法辨识「!important」而直接跳到下一行读取CSS，所以背景色会呈现橘色。</div>
<strong><br />
8.区别IE6、Firefox
</strong>
<div>【区别符号】：「_」<br />
【示例】：<br />
<div style="background-color: #eeeeee; font-size: 13px; border-left-color: #cccccc; padding-right: 5px; padding-bottom: 4px; padding-left: 4px; padding-top: 4px; width: 98%; word-break: break-all; "><!--<br />
<br />
Code highlighting produced by Actipro CodeHighlighter (freeware)<br />
http://www.CodeHighlighter.com/<br />
<br />
--><span style="color: #800000; ">#tip&nbsp;</span><span style="color: #000000; ">{</span><span style="color: #FF0000; "><br />
background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">black</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">Firefox&nbsp;背景变黑色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
_background</span><span style="color: #000000; ">:</span><span style="color: #0000FF; ">orange</span><span style="color: #000000; ">;</span><span style="color: #FF0000; ">&nbsp;</span><span style="color: #008000; ">/*</span><span style="color: #008000; ">IE6&nbsp;背景变橘色</span><span style="color: #008000; ">*/</span><span style="color: #FF0000; "><br />
</span><span style="color: #000000; ">}</span></div>
【说明】：因为IE6可以辨识「_」(底线)，但是Firefox却不行，因此可以透过这样的差异来区隔Firefox和IE6，有效达成CSS hack。
</div>
<img src ="http://www.blogjava.net/qchong/aggbug/313759.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/qchong/" target="_blank">Jarvis</a> 2010-02-24 09:17 <a href="http://www.blogjava.net/qchong/archive/2010/02/24/313759.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>牛年！</title><link>http://www.blogjava.net/qchong/archive/2009/01/26/252596.html</link><dc:creator>Jarvis</dc:creator><author>Jarvis</author><pubDate>Mon, 26 Jan 2009 13:46:00 GMT</pubDate><guid>http://www.blogjava.net/qchong/archive/2009/01/26/252596.html</guid><wfw:comment>http://www.blogjava.net/qchong/comments/252596.html</wfw:comment><comments>http://www.blogjava.net/qchong/archive/2009/01/26/252596.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/qchong/comments/commentRss/252596.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/qchong/services/trackbacks/252596.html</trackback:ping><description><![CDATA[牛年了！今年的目标要实现。好好做自己热衷的开发 ！！<br />
（好弱智的感慨）
<img src ="http://www.blogjava.net/qchong/aggbug/252596.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/qchong/" target="_blank">Jarvis</a> 2009-01-26 21:46 <a href="http://www.blogjava.net/qchong/archive/2009/01/26/252596.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>[原创]基于JQuery地区三级联动列表</title><link>http://www.blogjava.net/qchong/archive/2008/12/01/243796.html</link><dc:creator>Jarvis</dc:creator><author>Jarvis</author><pubDate>Mon, 01 Dec 2008 13:34:00 GMT</pubDate><guid>http://www.blogjava.net/qchong/archive/2008/12/01/243796.html</guid><wfw:comment>http://www.blogjava.net/qchong/comments/243796.html</wfw:comment><comments>http://www.blogjava.net/qchong/archive/2008/12/01/243796.html#Feedback</comments><slash:comments>8</slash:comments><wfw:commentRss>http://www.blogjava.net/qchong/comments/commentRss/243796.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/qchong/services/trackbacks/243796.html</trackback:ping><description><![CDATA[&nbsp;&nbsp;&nbsp;&nbsp; 摘要: 本文章系Jarvis原创 转载请注明!<br>    手头做的项目中需要用到地区库,在网上找了几个地区库,感觉不是很好,于是着手自己生成一个地区库.地区来自中国统计局网站(数据够官方)(地址是: http://www.stats.gov.cn/tjbz/xzqhdm/t20080215_402462675.htm),通过文本处理,生成到数据库(需要该地区数据库的朋友可留下邮箱地址,我发给你),做可处理操作. <br>    这次用到的联动是生成了一个地区的js文件,原来是采用AJAX实现联动的,后来感觉生成JS文件并不大,所以采用js方式.<br>    下面是js处理代码(基于JQuery):&nbsp;&nbsp;<a href='http://www.blogjava.net/qchong/archive/2008/12/01/243796.html'>阅读全文</a><img src ="http://www.blogjava.net/qchong/aggbug/243796.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/qchong/" target="_blank">Jarvis</a> 2008-12-01 21:34 <a href="http://www.blogjava.net/qchong/archive/2008/12/01/243796.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>