css hack


.selector {property /*\**/: value\9 }

这个IE6、IE7、IE8都能识别;但是IE8不能识别 “*” 和 “_” 的css hack;所以我们可以这样写hack:

.selector{width:300px;} /* 所有浏览器*/
.selector{width/*\**/:330px\9;} /* 所有浏览器IE浏览器 */
.selector{*width:310px;} /* IE7和IE6能识别,IE8和FF不能识别 */
.selector{_width:290px;} /* IE6能识别,IE7、IE8和FF不能识别*/
.selector{width:280px\0;} /* IE8 */
.selector{width:270px\0/IE8+9;} /* IE8+9 */
:root .selector{width:260px \0/IE9;}/* IE9 */


其它一些不常用的HACK:

Firefox 3 和 IE7 可識别:

selector, x:-moz-any-link, x:default {
/* Firefox 3 and IE7 rules here */
}

Safari 和 Opera 可識别:

@media all and (min-width: 0px) {
/* Safari and Opera rules here */
}



或者



@media screen and (-webkit-min-device-pixel-ratio:0){
/* Safari and Opera rules here */
}


.selector{
[color:#000; color:#f00 /* Safari & Chrome */
}



.selector{
[;color:red;]; /* chrome */
}


另外,IE5.5經已極少 人用了,不過萬一真有需要,可以用這個HACK:在屬性前面加”\”

.ie5hack{\width:100px;} /*無效*/

[參考阅读]

一些資料,有關Web標準、重構、語義

網站重構協會
http://www.webrebuild.org/index.htm

HTML5規範
http://www.whatwg.org/specs/web-apps/current-work/

◆《重构之美》总目录 ◆
http://yuntian.cnblogs.com/archive/2006/03/25/358776.html

中国式WEB标准
http://www.cssforest.org/blog/index.php?id=93

对WEB标准的理解
http://www.cssforest.org/blog/index.php?id=123

你是一个职业的页面重构工作者吗?
http://www.cssforest.org/blog/index.php?id=121

语义、标准和样式
http://dancewithnet.com/2008/05/12/semantics-standards-styling

Web标准 和 网站重构只是一种思想
http://www.chinaz.com/Design/Rules/0122640192009.html

所谓的web标准,WEB标准不是某一个标准,而是一系列标准的集合:结构化标准(XHTML、XML)、表现标准(CSS、XSLT?)、行为标准(DOM、ECMAScript)。这些东西在网上一搜一大把,在这里我就不多说了。

为什么要用标准(http://www.456bereastreet.com/lab/developing_with_web_standards/zh/#webstandards)有人会以为使用标准的目的就是为了达到标准。其实,《网站重构》一语道破天机:为了网站能“活”得更长久,为了提高网站的可访性,更为了降低成本,我们必须采用Web标准!这里有三个“为了”,没有一个是为了标准。标准只是手段。

  • 更简易的开发与维护: 使用更具有语义和结构化的 HTML,将让您更加容易、快速的理解他人编写的代码。
  • 与未来浏览器的兼容: 当您使用已定义的标准和规范的代码,那么您这个向后兼容的文本就消除了不能被未来的浏览器识别的后患。
  • 更快的网页下载、读取速度: 更少的 HTML 代码带来的将是更小的文件和更快的下载速度。如今的浏览器当处于标准模式下将比它在向下兼容模式下拥有更快的网页读取速度。
  • 更好的可访问性: 语义化的HTML(结构和表现相分离)将让使用读屏器以及不同的浏览设备的读者都能很容易的看到内容。
  • 更高的搜索引擎排名: 内容和表现的分离使内容成为了一个文本的主体。与语义化的标记结合会提高您在搜索引擎中的排名。
  • 更好的适应性: 一个用语义化标记的文档可以很好的适应于打印和其他的显示设备(像掌上电脑和智能电话),这一切仅仅是通过链接不同的 CSS 文件就可以完成。你同样可以仅仅通过编辑单独的一个文件就完成跨站点般的表现上的转换。

(X)HTML Strict 下標籤的嵌套規則

下面是一份在 HTML 4 Strict 和 XHTML 1.0 Strict 下必须遵守的标签嵌套规则,比如你不能在 <a> 里面再嵌入一个 <a> 这样的约定。

说明:

  • 为了方便读者阅读,本文中的标签使用了大写(根据 XHTML 的规则,元素名必须小写,比如 <html> 而不应是 <HTML>
  • 小写的单词表明一组或一系列 HTML 标签
  • 每一项条目(标签)后都跟随一组标签列表,如果没有这个列表,那么表明该条目(标签)内部不允许包含任何标签。这意味着该条目内部只能包含纯文本内容(#PCDATA,见下文)。如果注明 (empty),这意味着该条目内部不允许包含任何形式的内容。对于 flow,inline,block,OBJECT 和 BODY,其内部允许包含的内容在文中会单独给出。
  • #PCDATA 的意思是“parsed character data”,即纯文本内容(不包括任何 HTML 标签,但是转义内容可以存在,比如 &auml;&#228;
  • CDATA 的意思是“character data”,这意味着不包括转义内容的纯文本内容,详细内容可以参考CDATA Confusion
  • excluding … 意即不得直接或者间接的包含所列的元素

Continue reading →