我们在制作网页时，有时会希望一个元素既能像 block 一样定义宽度和高度，又可以像普通的 inline 一样不断行。例如下面这张图片中红线标出的地方：

通常我们实现这样的效果会使用这样的代码：

<a href=”#”><img src=”….” alt=”….” /></a>

这样虽然可以达到目的，但相对来说代码还是不够精炼，也不够灵活。而理想的方式，我们仅通过下面的代码即可实现：

<a href=”#”>Yangliu.name</a>

这样一来，我们就需要对 a 标签指定 width height 和 background-image。但 a 标签默认的 display 属性是 inline，width、height 是无效的。而如果对 a 设置 display:block，虽然可以解决宽度高度的问题，但元素会自动断行，无法达到我们需要的效果。有没有什么方式可以实现类似 img 标签那样，既可以设定高度宽度，又不会自动断行呢？

答案是肯定的。在 Opera 和 Webkit 中支持一个 CSS2 的属性 display: inline-block。利用这个属性，在 Opera 下即可完全实现我们所需的效果，但在其它浏览器下就不行了。

display 属性另外还有一个不太常用的值 display: inline-table。利用这个值也可以完全实现我们所需的效果。这个属性被除了 IE 以外的所有浏览器正确支持，但是…… 呃，又是 IE。虽然在面对 CSS 的时候所有 Web Developer 都会恨之入骨，但放弃 IE 就等于放弃 70% 的用户，所以我们还是得找出其它的解决方案。

没辙了，只好 Google，结果还真给我找到了。在这篇文章中指出，如果你首先触发 IE 的 hasLayout，然后再设置它的 display: inline，这个元素将变为 inline-block! 这样一来，我们就可以利用 IE 这个不可理喻的特点，结合一些 CSS Hacks，给出兼容各种浏览器的 CSS 代码：

.element-class {
    display: -moz-inline-stack;  //Firefox only code
    display: inline-block;       //some standard browsers
    zoom: 1;                     //IE only
    *display: inline;            //Only IE know this code (CSS Hack)
}

通过这样的代码就可以实现在各种浏览器中表现一致的 inline-block 了。不过这种方式有个小缺憾，就是无法通过 W3C CSS 验证。当然，要想通过验证也很简单，可以对除了 IE 之外的浏览器发出 inline-table 属性的样式表，对于 IE 单独发出一份 IE Only 的 CSS。

前不久我写过文章介绍微软刚刚推出的 Internet Explore 8。抛开那些技术性的东西不谈，IE8 中最具有新意、最 2.0 的功能就要数这个 Activities 了。通过微软的 Activities 站点，我们现在可以添加许多实用的 Activity，让我们的网上生活方便了不少。

如果您和我一样，同样是个 Firefox 的忠实用户的话，可能会因为 Firefox 上没有这样的功能而感到可惜。但 Firefox 强大的扩展功能总是给我们带来惊喜。Microsoft Activities for Firefox 这款插件就可以给 Firefox 也添加上 Activities，执行起来和 IE8 没有任何区别。可怜的 IE8，我又找不到什么理由来使用它了

Microsoft Acitvities for Firefox 可以为火狐浏览器添加完整的 Activities 功能，甚至，您可以直接通过微软的网站来添加 Activity。当然，这个扩展对于标准的 Activities XML 也是支持的，因此，您自己写的 Activity 也可以被正确的识别和执行。我截了张图演示一下执行效果，另外，我用的是 Firefox 3 Beta 4，扩展可以完全正常执行。当然，要想装上它的话，您需要先按照我之前文章中的说明设置一下 Firefox。感兴趣的朋友不妨试试。

扯远了，回来说 IE8。由于微软的 IE 向来都是和系统紧密集成的，我自然不愿意让一个 Buggy 的 Beta 版软件毁了我的 Vista，于是下了个 XP 的版本装在了虚拟机上。IE8 的安装过程和 IE7 几乎一模一样，纵然你下了一个十好几兆的安装包，它还非得上网去 check updates，而且还倍儿慢，真是有点烦人。

不过 IE8 给我的第一印象还是不错的，虽然界面上看起来和 IE7 如出一辙，不过 IE8 多了许多精美的小图标，功能也强大了很多。相对于 IE7，IE8 最大的进步在于 Addons 的管理。在这方面，IE8 应该是借鉴了 Firefox 的插件管理方式，界面都有几分相似，对于习惯了“流行”的浏览器的用户来说，也算用着还习惯。只是 IE8 这个插件管理器多少有点换汤不换药的感觉，除了全新的 Activities 外，剩下的就是把定制搜索引擎和加载程序管理器合并到了一起。不过 Activity 还是有些创意，可以很方便的将浏览器和 Web 2.0 服务结合起来，给用户带来不少方便。

当然，对于我个人，更感兴趣的还是 IE8 对于标准支持的状况。之前我曾写文章说 IE8 会优先使用“标准”来渲染页面，这使得我对 IE8 的期待值异常的高。但结果呢？我只能用“非常失望”来形容。我一直认为实战是最好的检验标准，所以我也不想用什么 acid 去测试（因为这些很容易被专门优化）。我博客的新模板在不改动任何 HTML/CSS 的情况下，在 Firefox 2/3，Opera 9，Safari 2/3 这些遵循标准的浏览器上都可以非常正确的执行，但到了 IE8 上，效果可以用“惨不忍睹”来形容了。对于原先 filter 这个 IE 特有的 CSS 属性的错误处理可以理解为“对标准的遵守”（这导致很多 Javascript 函数库执行出问题），但对于一些 CSS 属性（如 overflow，clear）的奇怪解释方法则让我实在有些摸不着头脑。现在我开始有些担心这个“标准”的 IE8 了，因为它在按照它自己的标准尽可能标准的渲染网页。好在在 IE8 内部集成了完整的 IE7 渲染引擎，用户也可以简单的一键更换，否则，相信 IE8 肯定会成为历史上最不受欢迎的 IE 版本。

Internet Explore 小组称，IE8 Beta1 是一个面向 Developer 的版本。我个人认为，这个版本也只能给 Developer 来用，给他们充分的时间来适应 IE8，改进自己的网页。IE8 Beta 1 内部集成了很好用的 Internet Explore Dev Toolbar，我看到有的报道说这玩意是抄袭 Firebug，其实不是的。这个工具在 IE6 时代就有，在微软的主页上少说放了两年，而且有分别对应 IE6/IE7/IE8 的版本。对于开发者来说，有了这个东西，调试还是方便了不少。不过我个人感觉，现阶段的网站，如果希望兼容 IE8，还是很有必要专门给他发送个样式表。

总之，我个人对 IE8 还是有些失望的。我个人希望未来的 IE8 版本可以在标准兼容方面能做得更好，而不是在标准这个问题上玩文字游戏。W3C 标准和 IE6/7 的标准，在现实 Web 开发过程中，已经是每个 Developer 必须要考虑到的内容。我能够理解微软这个大公司，IE 这个拥有 70%+ 市场份额的浏览器不愿意向 W3C 标准就范，但我更不希望微软回应的方式是创造另一个新的标准。因为后者会给开发者和用户带来更多的麻烦，相对于这种标准，我宁愿 IE8 坚守 IE6/7 的模式。

btw: 未来几天估计又要花时间修改 CSS/Javascript 来适应 IE8 了，真烦！

Update: 在页面的 head 中加入 <meta http-equiv=”X-UA-Compatible” content=”IE=7″ /> 可以强迫 IE8 使用 IE7 的渲染方式，也算是个不赖的过渡方案吧。

昨天才刚刚报道了 Internet Explore(IE) 8 将更好的支持 Web 标准，今天就被我在 Microsoft 的大本营找到了这个网站 —— IE8 Beta 1 下载页面。

当然，诸位翘首期盼的朋友也不要太兴奋，我也是兴奋之后大大失望了一下：页面上所有的下载链接都不能用。不过从这个页面上我们看到，Internet Explore 8 Beta 1 测试版将支持所有主流的 Windows 平台，例如 Vista 32/64，WinXP SP2，甚至 Windows Server 2008/2003 也都在支持之列。

不过这个页面也传达了一个信号，IE8 Beta 1 离我们已经很近了。我想应该用不了多长时间就会有可下载的版本。也许，明天就能下载也说不定

btw: IE7 真是个短命鬼，刚刚出来就要被 IE8 取代了 -_-b

所谓的 Web 标准，通常指的就是 W3C 指定的那一大堆标准。在这里也没必要详述，总之不是微软制订的，某些方面与微软的“标准”存在差异。绝大多数浏览器（Safari、Firefox、Opera）等渲染 HTML/xHTML 页面时都是遵循 Web 标准的，只是支持的程度不同而已。而微软的 IE 则是个例外，也许是出于兼容性考虑（上世纪 IE 与 NS 大战留下的后遗症），IE 总是会优先使用被称为 quirks mode 的方式进行渲染，这就造成了同样的代码在 IE 和其它浏览器上所呈现的结果不同。在表格布局的 Web 1.x 时代，这个差异还不太明显；但如今 div+css 布局的时代，这个小小的差异往往是致命的。对于用户来说，他们可能只能在特定的浏览器上才能看到正确的结果；对于 Web 设计者来说，为了消除不同浏览器的差异，达到 Cross-Browser 的效果，往往要多花几倍的力气，用上很多非常规的方式才能解决。

回来说 IE。客观的说，IE 在支持标准方面一直在不断的努力。自从 IE6 开始，对于 Web 标准的支持已经有较大程度的改善（例如正确处理 Box 模型等），而到了 IE7，随着对 Alpha PNG 的支持以及进一步对 Web 标准支持的完善，IE7 一定程度上已经相当令人满意了。例如我这次博客的改版，我特别写了程序为不同的浏览器送出了不同的样式表。但事实上，只是针对 IE6 的那张样式表与其它的区别比较大，而 IE7 和 Firefox/Safari/Opera 等支持 W3C 标准的浏览器，布局上完全使用的是同一个样式表。在这方面我个人已经很满意了，眼下最期待的，就是 IE7 可以随着自动更新装到每个 Windows 上，彻底淘汰了 IE6，那样写页面会轻松太多。

对于 Designer 来说，负担大大减轻了。但 Web 标准对于最终用户有什么好处呢？好处也是相当多的。首先，您可以看到正确的页面，大大减少由于标准支持差异而造成的页面错位等等情况；其次可以使用户摆脱束缚，因为支持标准，您可以使用任何支持标准的浏览器，而不用担心由此造成的无法访问或不正常使用网站等情况；更远一点说，您甚至可以摆脱 Windows 的束缚，用用 Linux，甚至用 iPhone 看看网页，都不会有问题。

从以上分析来看，微软貌似成了标准支持的最终受害者，因为它自己“打破”了自己的垄断地位。但是我觉得，IE Dev Team 是个经验丰富的团队，经历过消灭 Netscape 这样的大战，他们明白强加给用户最终会导致失败。回到标准上来，正当的和其它浏览器竞争，对于 IE 来说也是个机会。支持标准的 IE8，值得我们去期待。

LH 介绍了个小软件，让我们 IE 用户也不用再有这样的遗憾了。利用这个 IE 小插件，你在 IE 中同样可以实现 Firefox 一样的搜索工具条。而且最令我满意的是，调出这个搜索条的方法就是敲 Ctrl+F，不仅完全符合日常习惯，还能顺便赶走那个亘古不变的老土搜索框，真是完美啊！下面是我安装后的效果图，Vista+IE7，效果还是很不错的，虽然还是跟 Safari 没法比。

btw: 最近对 IE7 还是颇有好感，因为在做 Blog 的新模板，发现 IE7 对 CSS 的理解果然比 IE6 好了很多，需要专门调整的还是 IE6，而且需要 Hack 还是相当多。至于 IE6 以下的版本……我放弃了 -_-b

著名的开源话题网站 Open Addict 近日宣布，站点首页将不再支持使用 IE 浏览器浏览，同时随着站点其它页面改变的进行，整个站点将逐步驱逐 IE。

Open Addict 做出这个决定，并不是因为他们对开源事业的狂热支持，而是由于 IE 对于 W3C 标准的垃圾支持彻底热闹了它们。OA 的站长在声明中指出，他们精心设计的许多特效在 IE 浏览器下均得不到正确的渲染结果，但是在其它浏览器，例如 Firefox Safari Opera Konquer 等等等等（貌似是所有非 IE）都能很顺利的执行。他们已经厌倦了再专门为 IE 进行各种各样 Hack，因此做出驱逐 IE 的决定。

IE 对标准的支持确实很垃圾，而且这个问题困扰 Web 设计人员已经不知道多少年。但 IE7 是推出了，这个问题还是没有得到根本的改善。说白了微软还是希望自己能成为标准，而不想向 W3C 妥协。如今很多网站设计师都不得不耗费大量的时间精力和聪明才智，使自己的网站能在各种浏览器和平台下得到一致的效果，这其中针对 IE 进行的变通之术可以说是最多最烦的了。

我平时也经常进行一些网页设计和开发工作，在写 CSS 和 Javascript 的时候也会常常被 IE 郁闷掉。凭我个人的经验，一个网页如果在 Firefox 中测试良好，那么在其它主流非 IE 浏览器中（例如 Opera Safari）基本上都会得到完全一致的显示效果，而不需要任何特别的更改。但这样的网页，基本上很难在 IE 中达到同样的效果。针对 IE 的修改非常的繁琐，特别是对于 IE5、IE6和IE7的修改方案还各不相同，非常让人抓狂。

但是 IE 毕竟还是市场占有率上有绝对优势的浏览器，很多设计师甚至首先设计出 for IE Only 的网站，然后再逐步向 W3C 靠拢（其实这种做法很费时间）。而 Open Addict 这种放弃IE 放弃大多数的反常规做法确实很少见，也很有勇气。但是我觉得这一点点的星星之火实在无法撼动 IE 的地位，逼迫其进行改变。我们只能期盼 IE 的工程师们行行好在 IE7 SP(n) 或是 IE8 中改善对标准的支持，或是期盼 eBay 也变成 Firefox Only 的网站吧，呵呵（好像这两点都不太可能 -_-b）

今天上午写了一篇文章，谈到过多的浏览器给 Web 开发造成了困难，颇有抱怨的味道。不过抱怨归抱怨，各位朋友在文后的回复让我还是颇有收获的。尤其是 iqwolf 提到的 Multiple IE，试了一下，真是一个非常酷的东西。

对于安装有 IE7 的电脑，除非卸载 IE7，否则只能靠虚拟机的方式来运行 IE 的其它版本。有了 Multiple IE 就可以在现有的系统上同时运行 IE 3 – IE7。这对网站设计者来说好处是不言而喻的。

Multiple IE 的安装非常简单，在装有 IE7 的计算机上，下载这个安装包，安装即可。目前已知的问题是 IE4 不能正常工作，不过我们开发时主要测试的 IE 版本是 5.5，6 和 7，IE 4 其实可以不考虑了。

装好了 Multiple IE 后，我立刻看了看我的 Blog。原来我这个新模版在 IE6 下都是不正常的 -_-b。对 CSS 做了一点点小修改，IE 6 没问题了，等有时间时再把 IE 5.5 和 IE5 的做了。

Mutiple IE 确实是一个非常好的测试工具，强烈推荐的同时感谢 iqwolf。

微软将 IE 与操作系统紧密集成，当初是为了对付 Netscape。这一做法成功的击垮了 Netscape，但也为微软带来了无穷的安全性问题。网上相当数量针对 Windows 的攻击都是以 IE 为突破口的。微软的新操作系统 Windows Vista 以及新浏览器 IE7 都以安全性为标榜，自然不会让这种隐患继续存在下去。将 IE 剥离 Windows 的内核也就很正常了，至少使得 IE 可以和 Firefox，Opera 这样的对手站在同一起跑线上。

对于普通用户来说 IE 从内核中剥离似乎意味着删除 IE 将成为可能。但是 IE 长期捆绑造成非常多的软件使用了IE 提供的组件或函数，删除 IE 肯定会导致他们无法运行。我想微软也是发现了这一点才敢大大方方的将 IE 从内核中分离出去，既可以提高安全性，又不至于流失太多的用户，把持相当的市场份额。

昨天试了试 Firefox 2.0a，除了感觉速度似乎快了一点（心里作用？）外，没有感觉很令人兴奋的进步，还是期待正式版吧。

由于我平时都是用 Firefox 浏览的，所以在后期测试时就没有用其它浏览器看看。根据经验，肯定又是 Box 定义的问题，但是明明在做 HTML 效果页面的时候是好好的（ IE6 FF Opera 都测试通过），怎么做成模板后 IE6 又不认账了呢？

仔细对比了一下代码，发现在最终生成的页面中比效果页多出一行，就是第一行那个 <?xml version=”1.0″ encoding=”UTF-8″ ?> ，原来是犯了大忌！从模板中去掉这一行，IE6 下面的效果瞬间就正常了。

众所周知，IE 在处理 CSS Box 定义方面与 W3C CSS 有所不同，但对于 IE6 这个不同不是绝对的。IE6 内部事实上有两套 Box 定义，如果网页第一行为 <?xml version=”1.0″ encoding=”UTF-8″ ?> （一般 xhtml 网页都会有这一行），IE6 就会使用针对 xhtml 的引擎，并使用不规范的 box 定义，于是也就产生了页面错位等现象。IE 在处理 xhtml 文件时，事实上仍然使用的是 HTML 解析引擎（IE7 也仍然如此），所以根本没有必要在开头加上那一行。不加的话，IE6 的 Box 定义和 W3C CSS Box 定义基本上一致，可以有效的降低编写 CSS 的工作量。如果加上坏处主要有两点，第一就是 IE Box 模型的使用会导致页面错位，另一点就是对于像 Firefox 这样的浏览器会使用 XML 引擎来处理页面，一旦页面中出现任何不符合 XML 规范的内容（例如某个访客的留言中 HTML 标签未封闭），整个页面就无法显示了。所以现阶段，还是不要加这一行的好。

目前已知的问题，IE5 浏览还是不行，不仅CSS有问题，Javascript 也执行不了。不过 IE5 都是淘汰货了，还有必要支持它吗？其它浏览器（如 Konqueror Safari 之类）我还没有时间、条件来测试，有条件的朋友帮忙测一下，最好能把有问题的截图发给我，谢谢啦。

此外，接着这个机会，好好调整了一下页面，现在可以通过 XHTML 1.1 标准了