<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>VHUGES &#187; CSS</title>
	<atom:link href="http://www.vhuges.com/tag/css/feed" rel="self" type="application/rss+xml" />
	<link>http://www.vhuges.com</link>
	<description>We Are Hugo &#38; Jessie&#039;s Family</description>
	<lastBuildDate>Tue, 01 Jun 2010 07:10:39 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>创建性感CSS样式表的十个技巧(Sexy Stylesheet)</title>
		<link>http://www.vhuges.com/sexy-css-style-sheets-to-create-10-skills-sexy-stylesheet.html</link>
		<comments>http://www.vhuges.com/sexy-css-style-sheets-to-create-10-skills-sexy-stylesheet.html#comments</comments>
		<pubDate>Fri, 23 May 2008 12:34:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=203</guid>
		<description><![CDATA[如果你想成为一位CSS专家的话，光背出一堆选择器是不够的，还要能够提高CSS样式表的可读性，开发效率以及维护性。这里，Jina Bolton 将给我们分享一下她关于如何创建性感的CSS样式表的十个技巧。本文主要内容为：CSS代码编码规范，教你如何写出整洁漂亮性感的css代码，如何清晰的组织你的样式表文件。闲言少叙，直接进入正题，完整文字请查看原文。1. 不要在HTML文件中使用CSS样式定义相信对于多数有一定工作经验的设计师来说，使用外部样式表来定义CSS样式是小菜一碟的工作。但我在这里仍然需要再次告诉你这点，因为我看到相当多的站点在最开始的时候，有着非常结构清晰，组织良好的代码。但是随着时间的推移，慢慢地内部定义乃至内联样式开始蔓延到站点的各个角落。也许是因为项目周期十分紧迫，抑或只是因为我们有点偷懒。想象一下，当这样的坏习惯被我们保持了下来，一段时间后，如果老板希望在不改动网页内容的前提下重新设计网站的样式的话，OH，你将不得不去查找这些自己丢在各个角落的垃圾代码，如果项目碰巧规模又非常之大，那我恐怕只有祝你好运，或者推荐你去找黄健翔了。千万别给自己找这样的麻烦，创建干净的代码，并始终让他们保持干净，这样你会让生活变得充满快乐。注意：请小心使用过多的外部样式表，如果每次更改你都创建一个新的样式表，这不会给你带来任何好处。过多的样式表会让你将来的调试和更新工作变得更加复杂，当然我理解你希望将样式分组管理的初衷，后面的内容中我会专门和你一起讨论这个问题。友情提醒：过多的样式表应用，会带来潜在的性能问题，并且在IE6下，最多只能引入32个外部样式表。2. “语义学Semantics”不仅仅是一个让你迷惑的词语我要告诉你们，“语义学Semantics”将是你们最好的朋友。在你选择最合适，语义最正确的元素来描述文档内容之外，也请选择语义清晰，合适的词语来定义你的class名称以及元素ID名称。不仅仅是做正确的事，这样做还能让你和你的团队成员的工作变得更加简单。让我们来看一条样式定义：.l13k { color: #369; }我相信你乍看到这条定义，你能否知道它是用来干嘛的吗？我想你肯定答不上来。这个名称应该是某个只有作者本人知道的缩写，即使作者现在知道含义，但一个月后，一年以后你还能知道它的含义吗？让我们再来看一条定义：.left-blue { color: #369; }这条定义，你可能立刻猜到它是用来干什么的了，页面左边区域，文字颜色为蓝色，表述的非常清楚明确。但是让我们来假设一下，不久的将来，老板希望重新设计样式，这个区域的内容位置将换到右边，文字颜色将换成红色。很显然，这个名称将变得不再合适，甚至变得不正确，现在你有两个选择，一是替换掉每个使用该class的地方，二是继续使用这个让人产生误解的名称。这样看来，名称不是描述清晰就是好的，我建议你们最好是不要采用诸如颜色或者是高度宽度尺寸等非常具体的细节来命名样式定义，同样的也尽量避免使用具有具体形象的词汇来命名（比如使用 box），这样的做法某种程度上破坏了我们希望将内容和样式分离的初衷。怎样做才是最好的呢，让我们来看一下这个：.product-description { color: #369; }这个定义命名，无论你重构多少次，它都是非常合适的，美丽的东西永远是美丽的。3. 善用代码注释善用代码注释将会给你和你的团队成员带来极大的便利，不仅仅是通常的注解，我们还能非常创造性的去使用注释来帮助我们更好的完成工作。* 提示和标注代码注释最基本和最常见的用处就是用来提示和标注代码，告诉别人这是用来干嘛的。/* Turn off borders for linked images */img { border: 0; }* 时间戳和署名和我们写程序代码一样，是用注释在文件头部留下时间戳，版本号以及编辑者的署名，将更好的帮助我们追踪记录文件的历史记录。/* Sushimonster&#160;&#160;Typography&#160;&#160;Styles&#160;&#160;&#160;&#160; Up&#100;ated:&#160;&#160;Thu 10.18.07 @ 5:15 p.m.&#160;&#160;&#160;&#160; Author:&#160;&#160;&#160;&#160; Jina Bolton&#160;&#160; —————————————————-*/* 组织代码将样式定义按照不同的组别来分组是一个非常好的主意，如果我希望将页首的样式定义放在一起，我会使用这样的注释来帮助我提高代码可读性：/* HEADER&#160;&#160; —————————————————-*/* 注释标帜如果你采用了我上面提及的使用注释来分隔不同分组的样式定义代码的方法的话，那使用注释标帜将是一个非常有用的技巧来帮助你更好的查找代码，迅速准确的定位到你想要的位置。我们可以使用一个特殊的符号（比如 [=]）来作为注释标帜/* =HEADER&#160;&#160; —————————————————-*/非常酷的一个小技巧，这样你不用上下拖动，就能迅速通过查找来定位到你想要编辑的位置了，查看更多关于注释标帜。* 参考索引虽然不常用，但是也是非常有用的一个注释使用方式就是作为代码的参考索引，比如在文件头部留下使用到的颜色代码：/* COLORS&#160;&#160; Body Background:&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;#2F2C22&#160;&#160; Main Text:&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; #B3A576&#160;&#160; Links:&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;#9C6D25&#160;&#160; Dark Brown Border:&#160;&#160;&#160;&#160; #222019&#160;&#160; Green Headline:&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;#958944*/4. 明确什么时候使用CSS Hack 什么时候使用IE条件注释有很多关于使用CSS Hack带来的问题，或是使用IE条件注释来解决IE兼容性问题是更佳的方法的文章，以及两者都不支持的文章。以前，我一直认为使用IE条件注释解决这个问题要比CSS Hack来的合适，但是最近通过一些例证，我发现条件注释也不是最合适的解决方案。原因在于，使用条件注释，必然需要维护同一样式的不同IE版本的副本，这样就带来了工作量的增加，而使用CSS Hack则没有这个问题，因此要具体问题具体分析。但是不管采用哪种方法，请注意以下两点：a) 如果使用了条件注释，请在主代码文件中留下注释，提醒自己以及其他设计师，如果修改了此处样式，则需要同时更新其他所有IE版本的样式定义。b) 如果使用CSS Hack，也请留下注释，标明这里使用哪些Hack，对于什么版本浏览器生效，因为在可以预见的将来，随着浏览器版本的升级，这些Hack很有可能会失效。5. 组织好你的选择器以及属性声明切记，切记，请将你的样式表文件组织的结构清晰，我比较倾向于以下的代码组织方式：reset styles&#160;&#160;重置浏览器默认值 typography styles&#160;&#160;文字，版式定义 layout styl

<span class="readmore"><a href="http://www.vhuges.com/sexy-css-style-sheets-to-create-10-skills-sexy-stylesheet.html" title="创建性感CSS样式表的十个技巧(Sexy Stylesheet)">阅读全文——共4320字</a></span>]]></description>
			<content:encoded><![CDATA[<p>如果你想成为一位CSS专家的话，光背出一堆选择器是不够的，还要能够提高CSS样式表的可读性，开发效率以及维护性。这里，Jina Bolton 将给我们分享一下她关于如何创建性感的CSS样式表的十个技巧。<br/><br/>本文主要内容为：CSS代码编码规范，教你如何写出整洁漂亮性感的css代码，如何清晰的组织你的样式表文件。闲言少叙，直接进入正题，完整文字请查看原文。<br/><br/>1. 不要在HTML文件中使用CSS样式定义<br/>相信对于多数有一定工作经验的设计师来说，使用外部样式表来定义CSS样式是小菜一碟的工作。但我在这里仍然需要再次告诉你这点，因为我看到相当多的站点在最开始的时候，有着非常结构清晰，组织良好的代码。但是随着时间的推移，慢慢地内部定义乃至内联样式开始蔓延到站点的各个角落。也许是因为项目周期十分紧迫，抑或只是因为我们有点偷懒。<br/><br/>想象一下，当这样的坏习惯被我们保持了下来，一段时间后，如果老板希望在不改动网页内容的前提下重新设计网站的样式的话，OH，你将不得不去查找这些自己丢在各个角落的垃圾代码，如果项目碰巧规模又非常之大，那我恐怕只有祝你好运，或者推荐你去找黄健翔了。<br/><br/>千万别给自己找这样的麻烦，创建干净的代码，并始终让他们保持干净，这样你会让生活变得充满快乐。<br/><br/>注意：请小心使用过多的外部样式表，如果每次更改你都创建一个新的样式表，这不会给你带来任何好处。过多的样式表会让你将来的调试和更新工作变得更加复杂，当然我理解你希望将样式分组管理的初衷，后面的内容中我会专门和你一起讨论这个问题。<br/><br/>友情提醒：过多的样式表应用，会带来潜在的性能问题，并且在IE6下，最多只能引入32个外部样式表。<br/><br/>2. “语义学Semantics”不仅仅是一个让你迷惑的词语<br/>我要告诉你们，“语义学Semantics”将是你们最好的朋友。在你选择最合适，语义最正确的元素来描述文档内容之外，也请选择语义清晰，合适的词语来定义你的class名称以及元素ID名称。不仅仅是做正确的事，这样做还能让你和你的团队成员的工作变得更加简单。让我们来看一条样式定义：<br/><br/>.l13k { color: #369; }<br/><br/>我相信你乍看到这条定义，你能否知道它是用来干嘛的吗？我想你肯定答不上来。这个名称应该是某个只有作者本人知道的缩写，即使作者现在知道含义，但一个月后，一年以后你还能知道它的含义吗？让我们再来看一条定义：<br/><br/>.left-blue { color: #369; }<br/><br/>这条定义，你可能立刻猜到它是用来干什么的了，页面左边区域，文字颜色为蓝色，表述的非常清楚明确。但是让我们来假设一下，不久的将来，老板希望重新设计样式，这个区域的内容位置将换到右边，文字颜色将换成红色。很显然，这个名称将变得不再合适，甚至变得不正确，现在你有两个选择，一是替换掉每个使用该class的地方，二是继续使用这个让人产生误解的名称。<br/><br/>这样看来，名称不是描述清晰就是好的，我建议你们最好是不要采用诸如颜色或者是高度宽度尺寸等非常具体的细节来命名样式定义，同样的也尽量避免使用具有具体形象的词汇来命名（比如使用 box），这样的做法某种程度上破坏了我们希望将内容和样式分离的初衷。怎样做才是最好的呢，让我们来看一下这个：<br/><br/>.product-description { color: #369; }<br/><br/>这个定义命名，无论你重构多少次，它都是非常合适的，美丽的东西永远是美丽的。<br/><br/><br/>3. 善用代码注释<br/>善用代码注释将会给你和你的团队成员带来极大的便利，不仅仅是通常的注解，我们还能非常创造性的去使用注释来帮助我们更好的完成工作。<br/><br/>* 提示和标注<br/><br/>代码注释最基本和最常见的用处就是用来提示和标注代码，告诉别人这是用来干嘛的。<br/><br/>/* Turn off borders for linked images */<br/>img { border: 0; }<br/><br/>* 时间戳和署名<br/><br/>和我们写程序代码一样，是用注释在文件头部留下时间戳，版本号以及编辑者的署名，将更好的帮助我们追踪记录文件的历史记录。<br/><br/>/* Sushimonster&nbsp;&nbsp;Typography&nbsp;&nbsp;Styles<br/>&nbsp;&nbsp;&nbsp;&nbsp; Up&#100;ated:&nbsp;&nbsp;Thu 10.18.07 @ 5:15 p.m.<br/>&nbsp;&nbsp;&nbsp;&nbsp; Author:&nbsp;&nbsp;&nbsp;&nbsp; Jina Bolton<br/>&nbsp;&nbsp; —————————————————-*/<br/><br/>* 组织代码<br/><br/>将样式定义按照不同的组别来分组是一个非常好的主意，如果我希望将页首的样式定义放在一起，我会使用这样的注释来帮助我提高代码可读性：<br/><br/>/* HEADER<br/>&nbsp;&nbsp; —————————————————-*/<br/><br/>* 注释标帜<br/><br/>如果你采用了我上面提及的使用注释来分隔不同分组的样式定义代码的方法的话，那使用注释标帜将是一个非常有用的技巧来帮助你更好的查找代码，迅速准确的定位到你想要的位置。我们可以使用一个特殊的符号（比如 [=]）来作为注释标帜<br/><br/>/* =HEADER<br/>&nbsp;&nbsp; —————————————————-*/<br/>非常酷的一个小技巧，这样你不用上下拖动，就能迅速通过查找来定位到你想要编辑的位置了，查看更多关于注释标帜。<br/><br/>* 参考索引<br/><br/>虽然不常用，但是也是非常有用的一个注释使用方式就是作为代码的参考索引，比如在文件头部留下使用到的颜色代码：<br/><br/>/* COLORS<br/>&nbsp;&nbsp; Body Background:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;#2F2C22<br/>&nbsp;&nbsp; Main Text:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; #B3A576<br/>&nbsp;&nbsp; Links:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;#9C6D25<br/>&nbsp;&nbsp; Dark Brown Border:&nbsp;&nbsp;&nbsp;&nbsp; #222019<br/>&nbsp;&nbsp; Green Headline:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;#958944<br/>*/<br/><br/>4. 明确什么时候使用CSS Hack 什么时候使用IE条件注释<br/>有很多关于使用CSS Hack带来的问题，或是使用IE条件注释来解决IE兼容性问题是更佳的方法的文章，以及两者都不支持的文章。以前，我一直认为使用IE条件注释解决这个问题要比CSS Hack来的合适，但是最近通过一些例证，我发现条件注释也不是最合适的解决方案。<br/><br/>原因在于，使用条件注释，必然需要维护同一样式的不同IE版本的副本，这样就带来了工作量的增加，而使用CSS Hack则没有这个问题，因此要具体问题具体分析。<br/><br/>但是不管采用哪种方法，请注意以下两点：<br/><br/>a) 如果使用了条件注释，请在主代码文件中留下注释，提醒自己以及其他设计师，如果修改了此处样式，则需要同时更新其他所有IE版本的样式定义。<br/><br/>b) 如果使用CSS Hack，也请留下注释，标明这里使用哪些Hack，对于什么版本浏览器生效，因为在可以预见的将来，随着浏览器版本的升级，这些Hack很有可能会失效。<br/><br/>5. 组织好你的选择器以及属性声明<br/>切记，切记，请将你的样式表文件组织的结构清晰，我比较倾向于以下的代码组织方式：<br/><br/>reset styles&nbsp;&nbsp;重置浏览器默认值 <br/>typography styles&nbsp;&nbsp;文字，版式定义 <br/>layout styl<br />
es (header, content, foote<br />
r, etc.)&nbsp;&nbsp;布局定义 <br/>module o&#114; widget styles&nbsp;&nbsp;模块定义 <br/>etc. <br/>对于上面的分组之下，我根据元素DOM位置来分组：<br/><br/>any parent styles (containing elements, working outside-in)&nbsp;&nbsp;容器元素 <br/>block-level element styles (paragraphs, lists, etc.)&nbsp;&nbsp;块级元素 <br/>inline element styles (links, abbreviations, etc.)&nbsp;&nbsp;行级元素 <br/>etc. <br/>再之下，我根据元素类型来分组：<br/><br/>paragraphs&nbsp;&nbsp;&lt;p&gt; <br/>blockquotes&nbsp;&nbsp;&lt;blockquote&gt; <br/>addresses&nbsp;&nbsp;&lt;a&gt; <br/>lists &lt;ul&gt; &lt;dl&gt; <br/>forms&nbsp;&nbsp;&lt;form&gt; <br/>tables&nbsp;&nbsp;&lt;table&gt; <br/>最后对于每一个样式定义，我会将属性声明根据不同的类型分组：<br/><br/>positioning (with coordinates) styles <br/>float/clear styles <br/>display/visibility styles <br/>spacing (margin, padding, border) styles <br/>dimensions (width, height) styles <br/>typography-related (line-height, color, etc.) styles <br/>miscellaneous (list-style, cursors, etc.) styles <br/>很多人喜欢将属性声明按照字母排序，这个就是看个人喜好，但是我喜欢这样的分组方式。<br/><br/>6. 创建CSS Framework<br/>如果你发现你经常创建类似的样式表的话，那你可以创建属于自己的CSS Framework来积累大量的基础样式表，这样在将来可以大大简化你的工作。<br/><br/>screen.css &#8211; A screen CSS file can either have all your styles you want to be used for on screen, and/or can import additional styles, such as the following: <br/>reset.css &#8211; A reset CSS file can be used to “reset” all the default browser styling, which can help make it easier to achieve cross-browser compatibility.&nbsp;&nbsp;（我的重置样式表 undohtml.css） <br/>typography.css &#8211; A typography CSS file can define your typefaces, sizes, leading, kerning, and possibly even color. <br/>grid.css &#8211; A grid CSS file can have your layout structure (and act as the wireframe of your site, by defining the basic header, footer, and column set up). <br/>print.css &#8211; A print CSS file would include your styles you want to be used when the page is printed. <br/>Blueprint framework 就是一个非常不错的CSS Framework，大家可以看一下。<br/><br/>7. 平衡可读性和代码优化<br/>是将代码优化到极致（比如，没有注释，没有换行，压缩到体积最小），还是保留文档非常好的可读性。这个问题，每个人可以去找属于自己的平衡点。当然最理想的做法是，发布网站的时候再去压缩CSS样式表文件。<br/><br/>8. 熟练掌握你的文本编辑器<br/>不管你是使用textmate，dreamweaver，vim，还是什么，请一定要熟练掌握他们。工欲善其事，必先利其器。<br/><br/>9. 使用版本控制<br/>使用例如SVN或者CVS等版本控制程序来辅助我们更好的维护样式表。（对于我们程序员来说，可能这个再熟悉不过了，推荐使用SVN iloveit）<br/><br/>10. 创建并维护样式表文件指南<br/>如果你想成为一名出色的设计师，坚持这点吧。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/sexy-css-style-sheets-to-create-10-skills-sexy-stylesheet.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>全国哀悼日 网站黑白CSS滤镜代码</title>
		<link>http://www.vhuges.com/national-day-of-mourning-black-and-white-website-code-css-filter.html</link>
		<comments>http://www.vhuges.com/national-day-of-mourning-black-and-white-website-code-css-filter.html#comments</comments>
		<pubDate>Mon, 19 May 2008 06:13:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=207</guid>
		<description><![CDATA[根据国务院文件，5.19-5.21为全国哀悼日，在此期间，全国和各驻外机构下半旗志哀，停止公共娱乐活动，外交部和我国驻外使领馆设立吊唁簿。5月19日14时28分起，全国人民默哀3分钟，届时汽车、火车、舰船鸣笛，防空警报鸣响。 Admin5与很多草根网站都将整站换成素装。并建议中国所有站点更换为素装。 国务院决定5月19日至21日为全国哀悼日。为方便站点哀悼，特提供css滤镜代码，以表哀悼。以下为全站CSS代码。html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } 使用方法：这段代码可以变网页为黑白，将代码加到CSS最顶端就可以实现素装。建议全国站长动起来。为在地震中遇难的同胞哀悼。如果网站没有使用CSS，可以在网页/模板的HTML代码&#60;head&#62;和&#60;/head&#62; 之间插入：&#60;style&#62;html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}&#60;/style&#62; 有一些站长的网站可能使用这个css 不能生效，是因为网站没有使用最新的网页标准协议 &#60;!DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&#34;&#62;&#60;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&#62; 请将网页最头部的&#60;html&#62;替换为以上代码。有一些网站FLASH动画的颜色不能被CSS滤镜控制，可以在FLASH代码的&#60;object …&#62;和&#60;/object&#62;之间插入：&#60;param value=&#34;false&#34; name=&#34;menu&#34;/&#62;&#60;param value=&#34;opaque&#34; name=&#34;wmode&#34;/&#62; 最简单的把页面变成灰色的代码是在head 之间加&#60;style type=&#34;text/css&#34;&#62;html {&#160;&#160;&#160;&#160;FILTER: gray}&#60;/style&#62; 一般的discuz论坛在 你的控制css 文件下修改/images/header/header.css 这个文件，点源码即可看到。另在哀悼日或遇难的新闻，所有专题和主题 图片上不能使用红色标题。

]]></description>
			<content:encoded><![CDATA[<p>根据国务院文件，5.19-5.21为全国哀悼日，在此期间，全国和各驻外机构下半旗志哀，停止公共娱乐活动，外交部和我国驻外使领馆设立吊唁簿。5月19日14时28分起，全国人民默哀3分钟，届时汽车、火车、舰船鸣笛，防空警报鸣响。 Admin5与很多草根网站都将整站换成素装。并建议中国所有站点更换为素装。 国务院决定5月19日至21日为全国哀悼日。<br/><br/>为方便站点哀悼，特提供css滤镜代码，以表哀悼。以下为全站CSS代码。<br/><br/>html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } <br/><br/>使用方法：这段代码可以变网页为黑白，将代码加到CSS最顶端就可以实现素装。建议全国站长动起来。为在地震中遇难的同胞哀悼。<br/><br/>如果网站没有使用CSS，可以在网页/模板的HTML代码&lt;head&gt;和&lt;/head&gt; 之间插入：<br/><br/>&lt;style&gt;<br/>html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}<br/>&lt;/style&gt; <br/><br/>有一些站长的网站可能使用这个css 不能生效，是因为网站没有使用最新的网页标准协议 <br/><br/>&lt;!DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank" rel="external">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>&#34;&gt;<br/>&lt;html xmlns=&#34;<a href="http://www.w3.org/1999/xhtml" target="_blank" rel="external">http://www.w3.org/1999/xhtml</a>&#34;&gt; <br/><br/>请将网页最头部的&lt;html&gt;替换为以上代码。<br/><br/>有一些网站FLASH动画的颜色不能被CSS滤镜控制，可以在FLASH代码的&lt;object …&gt;和&lt;/object&gt;之间插入：<br/><br/>&lt;param value=&#34;false&#34; name=&#34;menu&#34;/&gt;<br/>&lt;param value=&#34;opaque&#34; name=&#34;wmode&#34;/&gt; <br/><br/>最简单的把页面变成灰色的代码是在head 之间加<br/>&lt;style type=&#34;text/css&#34;&gt;<br/><br/>html {<br/>&nbsp;&nbsp;&nbsp;&nbsp;FILTER: gray<br/>}<br/>&lt;/style&gt; <br/><br/>一般的discuz论坛在 你的控制css 文件下修改<br/>/images/header/header.css 这个文件，点源码即可看到。<br/><br/>另在哀悼日或遇难的新闻，所有专题和主题 图片上不能使用红色标题。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/national-day-of-mourning-black-and-white-website-code-css-filter.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS Naked Day 2008 &#8211; April 9th</title>
		<link>http://www.vhuges.com/css-naked-day-2008-april-9th.html</link>
		<comments>http://www.vhuges.com/css-naked-day-2008-april-9th.html#comments</comments>
		<pubDate>Mon, 07 Apr 2008 08:08:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=251</guid>
		<description><![CDATA[CSS NAKED DAY &#8211; CSS裸奔节今年就是第三届列，而今年也就是08年的第三届CSS裸奔节将日子定为4月9日。到4月9日，如果你愿意的话可将网站CSS链接暂时隐藏，让你的网站脱掉“衣服（CSS）”开始尽情的裸奔一天吧^_^从裸奔前后的对比来展示出CSS的魅力~CSS NAKED DAY 官方网站：http://naked.dustindiaz.com/来吧~加入CSS NAKED DAY：http://naked.dustindiaz.com/#signup

]]></description>
			<content:encoded><![CDATA[<p><img src="http://naked.dustindiaz.com/img/naked-day-08.png" border="0" alt=""/><br/><br/>CSS NAKED DAY &#8211; CSS裸奔节今年就是第三届列，而今年也就是08年的第三届CSS裸奔节将日子定为4月9日。到4月9日，如果你愿意的话可将网站CSS链接暂时隐藏，让你的网站脱掉“衣服（CSS）”开始尽情的裸奔一天吧^_^<br/><br/>从裸奔前后的对比来展示出CSS的魅力~<br/><br/>CSS NAKED DAY 官方网站：<a href="http://naked.dustindiaz.com/" target="_blank" rel="external">http://naked.dustindiaz.com/</a><br/>来吧~加入CSS NAKED DAY：<a href="http://naked.dustindiaz.com/" target="_blank" rel="external">http://naked.dustindiaz.com/</a>#signup<br/><br/></p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/css-naked-day-2008-april-9th.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>评《CSS商业网站布局之道》</title>
		<link>http://www.vhuges.com/assessment-css-layout-of-the-road-commercial-websites.html</link>
		<comments>http://www.vhuges.com/assessment-css-layout-of-the-road-commercial-websites.html#comments</comments>
		<pubDate>Tue, 30 Oct 2007 02:11:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[阅读]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=404</guid>
		<description><![CDATA[最近在当当定购了一本《CSS商业网站布局之道》，早上到办公室收邮件看到当当网发来的邀请对本书评价的邮件。于是将看了本书后的一些想法写了出来，也算是小评一下。希望对各位想买的朋友有些许参考价值～=========以下是写在当当网的评论内容=========市面上很多关于CSS应用理论的书，看它们也许更像是在看W3C的CSS教科书，对CSS各项数值各条规则都烂熟于胸但实际应用的时候仍然让很多不熟悉CSS+DIV布局的朋友一头雾水。鉴于太多太多书都是理论大于实践，因此在蓝色理想看到此书介绍时对于基于实践的讲解颇感兴趣，因为目前的很多WEB设计师对于CSS+DIV模式的开发还是不大熟悉，而在公司自己想推广CSS+DIV的相关开发模式，比如大到模块化的CSS可以便捷的对多个项目的多个系统表现形式进行开发、维护，小到统一的命名方式甚至注释的写法……等等。但是苦于没有一套系统的理论或相关的成熟些的开发模式借鉴，抱着试试看的想法于当当定购了此书。到手以后马上翻了一遍，里面对于开发过程设计师可能碰到的浏览器兼容问题的处理，归纳出了常见的解决方案。对于结构、命名规范有独特的见解，给了我相当的启发。在此谢谢此书作者的辛勤劳动，我想尽管目前国内WEB开发的总体水平确实落后于国外，但在众多身体力行的设计师的带动下，我们的WEB应用会上升到一个新的台阶&#8230;所有的设计师们，基于标准的WEB设计，从我们自己做起&#8230;PS：当然对于本书还是有些建议，比如光盘感觉有点鸡肋，就几十兆东西放网上哪都能共享出来，也许可以节省点成本给购书的读者更多实惠。而且，光盘里的源代码是否可以用WEB页面做个导航，另在相应页面直接搁置说明，并将相关效果代码放到文本框里，JS控制不同效果的展示&#8230;类似这些也许对其他技术类的书同样适用。=========以上是写在当当网的评论内容=========附本书当当网定购网址：http://product.dangdang.com/product.aspx?product_id=20037894

]]></description>
			<content:encoded><![CDATA[<p>最近在当当定购了一本《CSS商业网站布局之道》，早上到办公室收邮件看到当当网发来的邀请对本书评价的邮件。于是将看了本书后的一些想法写了出来，也算是小评一下。希望对各位想买的朋友有些许参考价值～<br/><br/>=========以下是写在当当网的评论内容=========<br/><br/>市面上很多关于CSS应用理论的书，看它们也许更像是在看W3C的CSS教科书，对CSS各项数值各条规则都烂熟于胸但实际应用的时候仍然让很多不熟悉CSS+DIV布局的朋友一头雾水。鉴于太多太多书都是理论大于实践，因此在蓝色理想看到此书介绍时对于基于实践的讲解颇感兴趣，因为目前的很多WEB设计师对于CSS+DIV模式的开发还是不大熟悉，而在公司自己想推广CSS+DIV的相关开发模式，比如大到模块化的CSS可以便捷的对多个项目的多个系统表现形式进行开发、维护，小到统一的命名方式甚至注释的写法……等等。<br/><br/>但是苦于没有一套系统的理论或相关的成熟些的开发模式借鉴，抱着试试看的想法于当当定购了此书。到手以后马上翻了一遍，里面对于开发过程设计师可能碰到的浏览器兼容问题的处理，归纳出了常见的解决方案。对于结构、命名规范有独特的见解，给了我相当的启发。在此谢谢此书作者的辛勤劳动，我想尽管目前国内WEB开发的总体水平确实落后于国外，但在众多身体力行的设计师的带动下，我们的WEB应用会上升到一个新的台阶&#8230;<br/><br/>所有的设计师们，基于标准的WEB设计，从我们自己做起&#8230;<br/><br/>PS：当然对于本书还是有些建议，比如光盘感觉有点鸡肋，就几十兆东西放网上哪都能共享出来，也许可以节省点成本给购书的读者更多实惠。而且，光盘里的源代码是否可以用WEB页面做个导航，另在相应页面直接搁置说明，并将相关效果代码放到文本框里，JS控制不同效果的展示&#8230;类似这些也许对其他技术类的书同样适用。<br/><br/>=========以上是写在当当网的评论内容=========<br/><br/>附本书当当网定购网址：<a href="http://product.dangdang.com/product.aspx?product_id=20037894" target="_blank" rel="external">http://product.dangdang.com/product.aspx?product_id=20037894</a><br/><br/>
<div align="center"><img src="attachments/month_0710/c200710301076.jpg" border="0" alt=""/></div>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/assessment-css-layout-of-the-road-commercial-websites.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS编写过程的一些原则</title>
		<link>http://www.vhuges.com/the-process-of-preparing-some-of-the-principles-of-css.html</link>
		<comments>http://www.vhuges.com/the-process-of-preparing-some-of-the-principles-of-css.html#comments</comments>
		<pubDate>Thu, 14 Jun 2007 05:31:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=634</guid>
		<description><![CDATA[1.若有疑问立即检测在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS 都有检测工具可用，请见http://validator.w3.org 。请注意，在文件开头的错误，可能因为不当的结构等因素造成更多错误；我们建议先修正一些最明显的错误之后重新检测，这样也许会让错误数量爆减。2.使用浮动功能时记得适当清除指令 浮动是个危险的功能，未必会产生您所期望的结果。如果您遇到浮动元素延伸到外围容器的边框或者其他不正常情况，请先确定您的做法是正确的。请参阅Eric Meyer 在Complex Spiral Consulting Web 网站上的教学。3.边界重合时利用padding或border来避免您可能会为了一点不应该出现的空间而焦头烂额，或者您需要一点点空间时，怎样都挤不出来。如果您有用到margin，那么很容易产生边界的重合；Andy Budd在他的网站上解释了可能的做法。4.尝试避免同时对元素指定padding/border以及高度或宽度Windows版IE经常导致width与height的计算问题。有些方法可以解决此问题，但如果母元素需要指定高度与宽度时，最好能够在母元素之内的子元素套用margin,或者当子元素需要指定高度与宽度时，在母元素套用padding以达效果。5.不要依赖min-width/min-heightWindows版IE并不支援两种语法。但是在某种程度下，windows版IE可以达到相当于min-width/min-height的效果，所以只要对IE做点过滤功能，即可达到您想要的结果。6.若有疑问，先减少百分比有时候某些错误会使50%+50%成为100.1%，使网页出现问题。这时请尝试将这些值改为49%，甚至49.9%。7.记住“TRouBLed”写法Border，margin与padding的简写语法有特定顺序，从上方开始顺时针方向转动：top,right,bottom,left. 所以margin:0 1px 3px 5px;的结果是上方无边界，右边1像素，以此类推。记住“TRouBLe”，您就不会弄错次序了。8.只要不是零的值，都要指定单位CSS需要您对每个font，Margin等各种值指定单位。（唯一的例外是line-height）

]]></description>
			<content:encoded><![CDATA[<p><strong>1.若有疑问立即检测</strong><br/>在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS 都有检测工具可用，请见<a target="_blank" href="http://validator.w3.org/" rel="external">http://validator.w3.org</a> 。请注意，在文件开头的错误，可能因为不当的结构等因素造成更多错误；我们建议先修正一些最明显的错误之后重新检测，这样也许会让错误数量爆减。<br/><br/><strong>2.使用浮动功能时记得适当清除指令</strong> <br/>浮动是个危险的功能，未必会产生您所期望的结果。如果您遇到浮动元素延伸到外围容器的边框或者其他不正常情况，请先确定您的做法是正确的。请参阅Eric Meyer 在Complex Spiral Consulting Web 网站上的教学。<br/><br/><strong>3.边界重合时利用padding或border来避免</strong><br/>您可能会为了一点不应该出现的空间而焦头烂额，或者您需要一点点空间时，怎样都挤不出来。如果您有用到margin，那么很容易产生边界的重合；Andy Budd在他的网站上解释了可能的做法。<br/><br/><strong>4.尝试避免同时对元素指定padding/border以及高度或宽度</strong><br/>Windows版IE经常导致width与height的计算问题。有些方法可以解决此问题，但如果母元素需要指定高度与宽度时，最好能够在母元素之内的子元素套用margin,或者当子元素需要指定高度与宽度时，在母元素套用padding以达效果。<br/><br/><strong>5.不要依赖min-width/min-height</strong><br/>Windows版IE并不支援两种语法。但是在某种程度下，windows版IE可以达到相当于min-width/min-height的效果，所以只要对IE做点过滤功能，即可达到您想要的结果。<br/><br/><strong>6.若有疑问，先减少百分比</strong><br/>有时候某些错误会使50%+50%成为100.1%，使网页出现问题。这时请尝试将这些值改为49%，甚至49.9%。<br/><br/><strong>7.记住“TRouBLed”写法</strong><br/>Border，margin与padding的简写语法有特定顺序，从上方开始顺时针方向转动：top,right,bottom,left. 所以margin:0 1px 3px 5px;的结果是上方无边界，右边1像素，以此类推。记住“TRouBLe”，您就不会弄错次序了。<br/><br/><strong>8.只要不是零的值，都要指定单位</strong><br/>CSS需要您对每个font，Margin等各种值指定单位。（唯一的例外是line-height）</p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/the-process-of-preparing-some-of-the-principles-of-css.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS Hack汇总快查</title>
		<link>http://www.vhuges.com/css-hack-quick-survey-summary.html</link>
		<comments>http://www.vhuges.com/css-hack-quick-survey-summary.html#comments</comments>
		<pubDate>Tue, 29 May 2007 01:36:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=666</guid>
		<description><![CDATA[原文：http://andymao.com/andy/post/76.html

屏蔽IE浏览器（也就是IE下不显示）

*:lang(zh) select {font:12px&#160; !important;} /*FF的专用*/select:empty {font:12px&#160; !important;} /*safari可见*/这里select是选择符，根据情况更换。第二句是MAC上safari浏览器独有的。

<span class="readmore"><a href="http://www.vhuges.com/css-hack-quick-survey-summary.html" title="CSS Hack汇总快查">阅读全文——共1723字</a></span>]]></description>
			<content:encoded><![CDATA[<p>原文：<a href="http://andymao.com/andy/post/76.html" target="_blank">http://andymao.com/andy/post/76.html</a></p>
<p><strong>屏蔽IE浏览器（也就是IE下不显示）</strong></p>
<p><span class="code">*:lang(zh) select {font:12px&nbsp; !important;} /*FF的专用*/<br />select:empty {font:12px&nbsp; !important;} /*safari可见*/<br />这里select是选择符，根据情况更换。第二句是MAC上safari浏览器独有的。</span></p>
<p><strong>仅IE7识别</strong></p>
<p><span class="code">*+html&nbsp; {&hellip;}<br />当面临需要只针对IE7做样式的时候就可以采用这个HACK。</span></p>
<p><strong>IE6及IE6以下识别</strong></p>
<p><span class="code">* html&nbsp; {&hellip;}<br />这个地方要特别注意很多地主都写了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。<br />html/**/ &gt;body&nbsp; select {&hellip;&hellip;}<br />这句与上一句的作用相同。</span></p>
<p><strong>仅IE6不识别</strong></p>
<p><span class="code">select { display /*IE6不识别*/:none;}<br />这里主要是通过CSS注释分开一个属性与值，流释在冒号前。</span></p>
<p><strong>仅IE6与IE5不识别</strong></p>
<p><span class="code">select/**/ { display /*IE6,IE5不识别*/:none;}<br />这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。</span></p>
<p><strong>仅IE5不识别</strong></p>
<p><span class="code">select/*IE5不识别*/ { display:none;}<br />这一句是在上一句中去掉了属性区的注释。只有IE5不识别</span></p>
<p><strong>盒模型解决方法</strong></p>
<p><span class="code">selct {width:IE5.x宽度; voice-family :&quot;\&quot;}\&quot;&quot;; voice-family:inherit; width:正确宽度;}<br />盒模型的清除方法不是通过!important来处理的。这点要明确。</span></p>
<p><strong>清除浮动</strong></p>
<p><span class="code">select:after {content:&quot;.&quot;; display:block; height:0; clear:both; visibility:hidden;}<br />在Firefox中，当子级都为浮动时，那么父级的高度就无法完全的包住整个子级，那么这时用这个清除浮动的HACK来对父级做一次定义，那么就可以解决这个问题 。</span></p>
<p><span class="code"></p>
<p><strong>截字省略号</strong></p>
<p><span class="code">select { -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }<br />这个是在越出长度后会自行的截掉多出部分的文字，并以省略号结尾，很好的一个技术。只是目前Firefox并不支持。</span></p>
<p><strong>只有Opera识别</strong></p>
<p><span class="code">@media all and (min-width: 0px){ select {&hellip;&hellip;}&nbsp; }<br />针对Opera浏览器做单独的设定。</span></p>
<p><font color="#008900">以上都是写CSS中的一些HACK，这些都是用来解决局部的兼容性问题，如果希望把兼容性的内容也分离出来，不妨试一下下面的几种过滤器。这些过滤器有的是写在CSS中通过过滤器导入特别的样式，也有的是写在HTML中的通过条件来链接或是导入需要的补丁样式。</font></p>
<p><strong>IE5.x的过滤器，只有IE5.x可见</strong></p>
<p><span class="code"></p>
<p>@media tty {<br />i{content:&quot;\&quot;;/*&quot; &quot;*/}} @import &#8216;ie5win.css&#8217;; /*&quot;;}<br />}/* */<br />IE5/MAC的过滤器，一般用不着</p>
<p>[Copy to clipboard] [ - ]CODE:<br />/*\*//*/<br />&nbsp;&nbsp;&nbsp; @import &quot;ie5mac.css&quot;;<br />/**/</p>
<p></span></p>
<p><strong>IE的if条件Hack</strong></p>
<p><span class="code">&lt;!&#8211;[if IE]&gt; Only IE &lt;![endif]&#8211;&gt;<br />所有的IE可识别<br />&lt;!&#8211;[if IE 5.0]&gt; Only IE 5.0 &lt;![endif]&#8211;&gt;<br />只有IE5.0可以识别<br />&lt;!&#8211;[if gt IE 5.0]&gt; Only IE 5.0+ &lt;![endif]&#8211;&gt;<br />IE5.0包换IE5.5都可以识别<br />&lt;!&#8211;[if lt IE 6]&gt; Only IE 6- &lt;![endif]&#8211;&gt;<br />仅IE6可识别<br />&lt;!&#8211;[if gte IE 6]&gt; Only IE 6/+ &lt;![endif]&#8211;&gt;<br />IE6以及IE6以下的IE5.x都可识别<br />&lt;!&#8211;[if lte IE 7]&gt; Only IE 7/- &lt;![endif]&#8211;&gt;<br />仅IE7可识别</span></p>
<p>以上内容可能并不全面，欢迎大家能和我一起把这些技巧都汇总起来，为以后工作的查询提供一个方便，同时在这里感谢那些研究出这些HACK的作者们。</p>
<p></span></p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/css-hack-quick-survey-summary.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS Hack</title>
		<link>http://www.vhuges.com/css-hack.html</link>
		<comments>http://www.vhuges.com/css-hack.html#comments</comments>
		<pubDate>Mon, 05 Mar 2007 08:25:00 +0000</pubDate>
		<dc:creator>Hugo</dc:creator>
				<category><![CDATA[敲键动鼠]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://vhuges.com?p=722</guid>
		<description><![CDATA[div#test&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; {height:20px; /*For Firefox*/}div#test&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; {*height:25px; /*For IE7 &#38; IE6*/}div#test&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; {_height:20px; /*For IE6*/}&#8212;&#8212;还可以如下这般&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;div#test&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; {height:20px;}&#160;&#160;/*-for ff-*/* html div#test&#160;&#160;{height:25px;}&#160;&#160;/*-for ie6-*/*+html div#test {height:20px;}&#160;&#160;/*-for ie7-*/号称CSS2.0能最大限度的解决目前面临的很多浏览器兼容问题，但是如果浏览器支持不够那我们也没办法，目前对各主流浏览器（Firefox、IE7/6）兼容的CSS写法出现了如上这些新的写法，但是怎么写方便就个人习惯列，自己选吧哈。

]]></description>
			<content:encoded><![CDATA[<p>div#test&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {height:20px; /*For Firefox*/}<br/>div#test&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {*height:25px; /*For IE7 &amp; IE6*/}<br/>div#test&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {_height:20px; /*For IE6*/}<br/><br/>&#8212;&#8212;还可以如下这般&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br/><br/>div#test&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {height:20px;}&nbsp;&nbsp;/*-for ff-*/<br/>* html div#test&nbsp;&nbsp;{height:25px;}&nbsp;&nbsp;/*-for ie6-*/<br/>*+html div#test {height:20px;}&nbsp;&nbsp;/*-for ie7-*/<br/><br/>号称CSS2.0能最大限度的解决目前面临的很多浏览器兼容问题，但是如果浏览器支持不够那我们也没办法，目前对各主流浏览器（Firefox、IE7/6）兼容的CSS写法出现了如上这些新的写法，但是怎么写方便就个人习惯列，自己选吧哈。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.vhuges.com/css-hack.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
