omiga

伪类:first-letter可用于选择对象文本中的第一个字符。IE7，FF，opera，safari对该伪类支持得很好，但是IE6不支持该对象。不支持并不代表不能用～···这个世界上有太多太多针对IE的hack方法～···

使IE6支持:first-letter的方法如下：

select:first-letter {...}

即在选择符与样式花括号之间留出一空格即可，当然你要愿意多留几个也是可以的，但是不留IE6就不行了～···

虽然已经骂过IE6无数次了，但是今天还要骂，因为刚刚改一个IE6的BT问题，让我非常恼火。

我使用的浏览器主要是FF，所以一般我做页面测试也先在FF中进行，不仅仅是因为FF好用，同时也因为FireBug太强大了，调试JS省去不少精力。虽然如此，现今做调试时FF，IE7,IE6一个都不会落下，毕竟IE仍然占据着大部分浏览器市场，opera，safari也会做简单的调试，只要没有出现严重的问题，一般在这两种浏览器上花费的精力较少，同时由于对web标准的良好支持，FF调试通过的页面一般在opera和safari下都是没有什么问题的。

今天写的页面，在我机子上好好的，JS,CSS都执行的很好。拿给搞Ajax的同学和搞PHP的同学那，他们的IE6都出现了相同的问题，具体问题不重要。然后我辛苦的调试，在Ajax的机子上OK了，然后跑PHP同学那，把页面搞出来刷两下，靠，问题又没有了～···[aaa]，真叫人哭笑不得，而且问题的解决方法还是那么的BT，删除了一段HTML代码的空格就搞定了，当然这次不是重复字符的问题了，能说什么呢，只能说IE6，I服了YOU！很BT，很龌龊！

换了skin，重做个登入页面，中午只在FF中测试了，顺便用IE Tab简单测试下，没问题。下午在线看了《龙之战争》后，用IE6试试！cao～！又是重复字符！关于IE6产生重复字符bug，一般情况下可能是由于多个浮动元素之间的注释造成的，那么不一般的情况可能是代码结构的问题，比如我上次的浮动。这次我是彻底对IE失望，对IE6绝望！很多问题产生的莫名其妙，我找，我查，我改！

问题解决方法:删除代码中所有用于格式化的东东，包括换行，空格等。也就是说你的代码只是代码，密密麻麻的代码，其他什么都没有。这样问题就没了～···[aaa]

这个问题发现很久了，还是在暑期改版的时候一个页面中的问题。由于当时我的IE6绿色版有些问题，并没有出现这个bug，后来在网吧的IE6上才发现这个问题。 产生该bug需满足两个条件：

1. 浮动的仅是<embed>标签，外层并无<object>
2. 相邻浮动容器中的字符不能包含在内联元素中

产生bug的主要代码：

<!--
body{font-size:12px;}
#container{width:900px; margin:0 auto;}
h1{text-align:center;}
p{text-indent:2em; line-height:18px;}
-->
<h1>关于使用浮动&lt;embed&gt;产生重复字符的问题</h1>
<div id="container">
<object width="100" height="100" data="abt.swf" type="application/x-shockwave-flash">
<param name="src" value="abt.swf" /><param name="wmode" value="opaque" />
<param name="quality" value="high" />
</object>
<div id="content" style="margin: 0pt 15px 15px; width: 645px; float:right;">
这个问题发现很久了，还是在暑期改版的时候一个页面中的问题。由于当时我的IE6绿色版有些问题，并没有出现这个bug，后来在网吧的IE6上才发现这个
问题。产生该bug需满足两个条件：浮动的仅是<embed>标签，外层并无<object>相邻浮动容器中的字符不能包含在内联元素中。
<p style="color:#F00; font-size:14px; font-weight:bold;">大家注意看，本段文字的最后一个字符将在下一行重复显示</p>
</div>
</div>

点击查看代码演示 如上所述，产生该bug的条件，其实也隐含了解决此bug的部分方法。故解决此bug至少有以下方法。

• 使用严格的嵌套方式插入flash，可以使用<object>嵌套，或是在外层嵌套其他标记，只要不让<embed>浮动即可；
• 相邻文本嵌套在内联元素中；
• 在文本字符后添加HTML注释，即<!—->；

以下代码为使用注释方式修复此bug：

<!--
body{font-size:12px;}
#container{width:900px; margin:0 auto;}
h1{text-align:center;}
p{text-indent:2em; line-height:18px;}
-->
<h1>关于使用浮动&lt;embed&gt;产生重复字符的问题</h1>
<div id="container">
<object width="100" height="100" data="abt.swf" type="application/x-shockwave-flash"><param name="src" value="abt.swf" /><param name="wmode" value="opaque"
/>
<param name="quality" value="high" />
</object>
<div id="content" style="margin: 0pt 15px 15px; width: 645px; float:right;">
这个问题发现很久了，还是在暑期改版的时候一个页面中的问题。由于当时我的IE6绿色版有些问题，并没有出现这个bug，后来在网吧的IE6上才发现这个
问题。产生该bug需满足两个条件：浮动的仅是<embed>标签，外层并
无<object>相邻浮动容器中的字符不能包含在内联元素中。
<p style="color:#F00; font-size:14px;font-weight:bold;">大家注意看，本段文字的最后一个字符将在下一行重复显示</p>
<!--修复IE6浮动embed产生重复字符bug-->
</div>
</div>

点击查看代码演示 该bug本应该从一开就被避免，只是由于我使用了

<embed src="abt.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="opaque" menu="false" style="width:225px;height:335px;float:left;"></embed>

在页面中插入flash，所以实际中这个问题出现的几率应该是非常的小，发文志之。