Hauy`s blog

最近在工作中发现IE7在处理有序列表时有一个bug。 情况如下： 把ol中的li设置css属性overflow设置为hidden或者auto时，列表的序号将不能正常显示。如图所示： 同时，当list-style-type属性设置为lower-roman时，只显示罗马字母i， 同理，设为lower-alpha时，只显示小写字母a。 经过测试，其他浏览器均未发现此现象。 在网上搜索了一番，仍不知是何种原因导致这种情况出现，希望诸位指点。 另外，我在IE8里面测试了这个页面发现干脆连前面的序号也不显示了， 由于IE8现在还在测试期，所以不能肯定在将来还会有这个bug。IE8下的表现应该是符合标准浏览器的解析方式。 即当list-style-position属性默认为outside时，序号就显示在li这个box之外了， 所以overflow设置为hidden时，序号自然就不显示了。 另外，IE7还有这个现象： 在正常情况下，list-style-position属性设置为inside时，序号能显示在li这个box之内。 但是当overflow设置为hidden时，即使将list-style-position属性设置为inside，序号仍然出现在li这个box之外， 此时，上述的bug也会发生。 测试页面地址请点击这里。

查看全文 »

前几天看到口碑网的朋友写了一篇《如何编写兼容各主流邮箱的HTML邮件》，很不错。 在这里，我也要把我的经验和大家分享一下。 众所周知，Email是一项最古老的互联网应用之一。 因此，不少邮件系统还是会采用一些比较古老的处理方式，导致前端方面很多新的技术、新的特性无法被支持。 而且各个邮箱系统以及客户端的差异，也会使email的最终呈现出现很大的偏差。 HTML细节 就目前来说，如果要做一个email页面，为了保证最大的兼容性，有以下几点需要注意： 对于纯文本邮件： 邮件标题不要超过18个字； 每行不要超过34个字。 对于HTML邮件： 邮件标题不要超过18个字； HTML代码和图片尽量不要超过50kb； 页面宽度推荐500px，最大不要超过600px； 避免使用边缘的、非主流的HTML技术； 不使用css来布局，应该使用表格来布局； 不使用外联的css样式，而使用font标签来定义样式，定义链接颜色时也是如此，写法如下： <font style=”font-family:arial,helvetica; font-size:10pt; color:#000000″> … </font> 不使用Flash、Java、Javascript、frames、i-frames、ActiveX 以及 DHTML ； body和meta之类的标签是可以无视的，因为在很多邮箱系统里它会被过滤； 如果整个邮件有用到背景色或背景图，建议用以下方式处理：<table border=”0″ cellpadding=”0″ cellspacing=”0″ width=”100%” height=”100%”> <tr> <td width=”100%” height=”100%” bgcolor=”…..”> <!— 邮件内容 –> </td> </tr> </table> 有背景图片的时候，我们要采用这种写法：<table background=”background.gif” cellspacing=”0″ cellpadding=”0″>

查看全文 »