深山老林

之前找了几个不同版本的可独立运行的IE浏览器，正好拿来试试页面的兼容性问题。不试不知道，在IE6和FF中没问题的页面在IE5和IE5.5中乱成一团，一直听说IE5是WEB标准制作的一个“钉子户”，现在不得不相信了。

既然有问题，那就找找解决的方法咯，在网上一搜，相关的文章还是不少的，觉得最直接的方法还是“IE条件注释”，很方便的就能为IE的不同版本写样式。但这样就得为每个版本写一个样式，不利于文件的优化。

找了一些相关的CSS HACK后，觉得应该可以把IE5/IE5.5/IE6/FF的HACK写到一起的，经过测试，终于找到了一个不错的方法，下面我们来看看怎么实现：
大家都知道用!important声明可以提升指定样式规则的应用优先权，如下面的例子：
-------------------------------------------------
E1{
 background-color: red !important;/*提升优先权*/
 background-color: blue;
}
-------------------------------------------------

但这样写在IE中会有个问题，看过我的《关于CSS样式表优先级》和《关于CSS样式表优先级补遗》，你会知道在IE6和FF中用!important声明可以提高优先级别，但在IE6中的!important声明并不是绝对的，它会被之后的同名属性定义所替换。也就是说在上面的例子中，IE6所应用的是最后一个背景色的值，即“blue”；而在FF中背景色的值为“red”。根据这一点，我们就可以把FF和IE的样式分离开。
OK ，解决了FF和IE的问题，现在来解决IE自己的问题。
看过了嘟嘟的《绕过IE6支持IE5的别一种写法-IE也支持">"》后有感而发，使用“>”IE是否真的可以认得？我们来看个例子：
-------------------------------------------------
E1{
 background-color: red;
 >background-color: blue;
}
-------------------------------------------------

在FF中得到的是背景色红色，而在IE中得到的背景色是蓝色，根据样式重定义的规则，如果浏览器可以识别“>”，则应该得到的蓝色的背景，因此可以知道“>”只有IE可以识别，这点是很重要的哦！在后面大家就会知道了。（注：我测试过其它的一些符号，如“~”、“`”、“<”等，都只有IE可以识别，在此为了感谢嘟嘟，推荐使用“>”）

我们再来看个例子：
-------------------------------------------------
E1{
 >/*IE only*/background-color: black;
 >/*IE only*/background-color /*IE5.5*/: green;
}
-------------------------------------------------

这个例子在IE6中得到了黑色的背景；而在IE5.5中得到的绿色的背景；在IE5中也得到了黑色的背景。这就说明了第二句定义只有IE5.5能识别，这是个很早就公布的HACK，可以在网上找到相关的资料，要注意的就是在属性名之后是有一个空格的。到此我们已经把FF、IE5.5、IE6分离出来了，那IE5呢？其实现在我们只要把IE5跟IE6分开就OK了，来看看例子：
-------------------------------------------------
E1{
 >/*IE only*/background-color: red;/*IE5*/
}
E1/*IE5.5+*/{
 >/*IE only*/background-color: black;
}
-------------------------------------------------

这里我们又用到一个HACK，就是“E1/**/{}”，这个定义在IE5以上的版本才能识别出来。这个例子得到的结果是，在IE5中的背景色为红色；在IE5以上版本中得到的是黑色背景。
终于把不同版本的浏览器都分离出来了，这样我们就可以为不同的浏览器定义不同的样式了。来看个完整的例子：
-------------------------------------------------
E1{
 width: 500px;
 height: 50px;
 background-color: red !important;/*FF*/
 background-color: blue;/*IE5*/
 text-align:center;
}
E1/*IE5.5+*/{
 >/*IE only*/background-color: black;/*IE6*/
 >/*IE only*/background-color /*IE5.5*/: green;
}
-------------------------------------------------

需要注意的是，在上面例子中“background-color”定义的顺利不能改变，即FF-IE5-IE6-IE5.5。对于IE的定义在属性前要加“>”，因为“E1/**/{}”这个HACK在FF中可以识别。也许你会想，上面的例子不是可以写成：
-------------------------------------------------
E1{
 width: 500px;
 height: 50px;
 background-color: red;/*FF*/
 >background-color: blue;/*IE5*/
 text-align:center;
}
E1/*IE5.5+*/{
 >/*IE only*/background-color: black;/*IE6*/
 >/*IE only*/background-color /*IE5.5*/: green;
}
-------------------------------------------------

这样不就又可以省下几个字节？是没错，可是HACK不是标准，如果滥用HACK，那只会离标准越来越远！

今天终于来到了腾讯公司的办公大楼，在深圳南山区的飞亚达大厦。刚好今天是腾讯的招聘日，在五楼大厅里，有很多的来自各地的高手来应聘，场面很热闹，在大厅里至少有超过15个的不同部门的招聘摊位。看了一下在我之前的应聘者，很多都是埋头写着，过去偷偷看了一下，才知道原来是在写“试题”。代码要求手写，一时把我吓了一跳，这也太那个了吧，到目前还没有遇到过面试的试题是要在纸上写代码的，对于用惯了“Ctrl+C和Ctrl+V”的人来说，这可是一大挑战。问了一下“咨询处”，得要“指示”到前面“网页制作”的摊位去看看，我来到“网页制作”的摊位前排队，在我前面的有两个应聘者，考官跟他们谈了一会后给了他们一张纸，就让他们走开了……有点紧张，我昨晚写到十二点多的简历没有打印出来，因为我做成了网页的形式，打印就没“意思”了，结果正如我所料的，一坐下去，那考官就问我有没简历～没有～去那边先填个表吧～于是我只好到旁边拿了个“求职表”填填了……
好不容易填好了简历，再次到“网页制作”的摊位前一看，已经排了好几个来应聘的人了，心想还是先打个电话吧，再怎么说人家也是要我来的时候打电话给他先的，还是先联系下好……还好打了电话，原来是要我到七楼的。
到了七楼，原来那里是办公的地方，足足有足球场那么大，每个位子上都放着超可爱的QQ公仔，有大有小，真的很有意思……
后面的面试过程就略过吧，也是要我做“题”，不过幸运的是我不用在纸上做！
个人感觉还是不错的，现在就等我把“题”做好了！下星期又是一堆的工作……看来又得“熬夜”了。

公共定义

#show,#show1,#show2,#show3,#show4,#show5,#show6,#show7,#show8{
width:400px;
margin:20px;
padding:20px;
}
.show1,.show2,.show3,.show4,.show5,.show6{
width:400px;
margin:20px;
padding:20px;
}
ID测试1
*>html #demo1#test1 #show1
{
background-color : #999;
color:#fff;
}
id测试2
* html>#demo2 #test2 #show2
{
background-color : #999;
color:#fff;
}
id测试3
* html #demo3>#test3 #show3
{
background-color : #999;
color:#fff;
}
id测试4
* html #demo4 #test4>#show4
{
background-color : #999;
color:#fff;
}
id测试5
* html #demo5>#show5
{
background-color : #999;
color:#fff;
}
id测试6
* html #demo6 #show6
{
background-color : #999;
color:#fff;
}
id测试7
* html #demo7#show7
{
background-color : #999;
color:#fff;
}
小结:从5~6~7时~ ID测试567是一样的~应该是IE5把忽略 >

class测试1
*>html .demo1.test1 .show1
{
background-color : #999;
color:#fff;
}
class测试2
* html>.demo2 .test2 .show2
{
background-color : #999;
color:#fff;
}
class测试3
* html .demo3>.test3 .show3
{
background-color : #999;
color:#fff;
}
class测试4
* html .demo4 .test4>.show4
{
background-color : #999;
color:#fff;
}
class测试5
* html> .demo5 .test5 .show5
{
background-color : #999;
color:#fff;
}
class测试6
* html.demo6 .test6 .show6
{
background-color : #999;
color:#fff;
}
class测试7
.test7.show7
{
margin:20px;border:1px solid #f00;
}
class测试8
.test8 .show8
{
margin:20px;border:1px solid #f00;
}
原来大家的写法
@media tty {
i{content:"\";/*" "*/}};#show
{
background-color : #999;
color:#fff;
}
{;}/*";}
}/* */
总结 IE5会把忽略">" ,而且跟在html后面如果是ID,连着写IE5也是认识的(见class测试6,id测试8), 虽然IE5不能支持">",可是IE6不认识">" 我们就可以利用IE5 和IE6 对">"的不同解析,用他来绕过IE6.
测试环境:windows2000+IE5, window2000 +IE6, window98升级2K+IE5

转自Beautiful Style   演试文件  作者:嗷嗷

以前写过一篇《关于CSS样式的优先级问题》，当时由于对浏览器的兼容性问题没有太多的了解，所用到的例子也没有提到与浏览器相关的内容，在此做一下补充：

在此要特别提到!important声明，下面还是用以前的那个例子：

-----------------------------------------
<style type="text/css">
<!--
#aaa{
   background-color: Fuchsia;
}
.aaa{
   background-color: Black;
}
td{
   background-color: Aqua !important;
}
-->
</style>
<table>
<tr>
<td class="aaa" id="aaa" style="height:200px;width:200px;background-color: Blue;"></td>
</tr>
</table>
------------------------------------------

td将会显示为Aqua，这在IE4+的浏览器与支持!important声明的都是正确的，但如果换成这下这样：

-----------------------------------------
<style type="text/css">
<!--
#aaa{
   background-color: Fuchsia;
}
.aaa{
   background-color: Black;
}
td{
   background-color: Aqua !important;
   background-color: Green;
}
-->
</style>
<table>
<tr>
<td class="aaa" id="aaa" style="height:200px;width:200px;background-color: Blue;"></td>
</tr>
</table>
------------------------------------------

这个例子的结果是在IE4+的浏览器中td的颜色为Blue，而在FF中的颜色为Aqua 。这说明了在IE4+浏览器中的!important声明并不是“真正的提高优先级”，或说是“不完全的声明”，在声明之后如果有新的、相同属性名的定义，!important声明将会失效。而在FF中，!important声明在同个样式类中的优先级始终是最高的。

因此，当要修正IE与FF中的差异时，就可以使用第二个例子中的做法，大多数是用于修正定位的问题。

有人说：“机遇总是在不知不觉中来到你面前，只有时刻的准备着，才能在机遇离开之前抓住它。”

今天中午一个自称是“腾讯公司互联网业务系统网站制作主管”的人联系我，说要跟我见下面，这是真的吗？我真的不敢相信，为什么会找上我？一时间很多的疑问、兴奋、担心……真可以说是百感交集。这如果是真的，那就是一个很大的机遇了，可以让我的技术在短时间内提升的机会，可以更快的接近我的所谓“理想”……

也是一个用JS写的网站，可以自定义栏目，可以拖动、编辑等等，一个字“强”

www.netvibes.com

一个把DOS界面的程序移植到Web的网站，感觉很爽。

JS/UIX is an UN*X-like OS for standard web-browsers, written
entirely in JavaScript (no plug-ins used). It comprises a vir-
tual machine, shell, virtual file-system, process-management,
and brings its own terminal with screen- and keyboard-mapping.

For an overview of implemented commands have a look at the
complete > JS/UIX-Manual-Pages; see also the > Version-History.

The keyboard accepts the US-ASCII character set.
As key-mapping depends from your browser, you may have to use
the cursor and backspace buttons at the lower right of the
terminal. A complete keyboard can be accessed at the lower left.

Compatibility: Netscape 4+, MS IE 4+ and DOM-aware browsers.


JS/UIX is not a free software. For a free to use terminal-
interfaces have a look at mass:werk termlib.js.


© 2003 mass:werk, N.Landsteiner

www.jsuix.com

珍珠项链