[转]:first-letter和:first-line伪类

本以为IE 6基本不支持伪类的,不过今天看到:first-letter和:first-line也可在IE 6下使用,于是测试了下,却没看出效果。

 

检查了半天原因,发现:first-letter只能作用于display: block的元素,而我测试的是span,默认为inline元素…

此外,IE 6中还有个要注意的问题,由于这个伪类存在连接符,所以后面不能紧跟大括号和逗号等字符,必须用空格分隔开(没想到逗号都不行,太囧了)。如果使用CSS压缩器的,就要特别注意下这个问题了。

最后给段例子:

The xhtml code:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">  
  3.   <head>  
  4.     <meta http-equiv="Content-Type" content="text/html; charset=gbk" />  
  5.     <title> first-letter </title>  
  6.     <style type="text/css">  
  7.       p { width: 3em; font-size: 100%; }  
  8.       #p1:first-letter , #d1 p:first-letter { font-size: 200%; }  
  9.       #d2 p:first-line { color: red; }  
  10.     </style>  
  11.   </head>  
  12.   <body>  
  13.     <p id="p1">这是首字下沉</p>  
  14.     <div id="d1">  
  15.       <p>这也是首字下沉</p>  
  16.     </div>  
  17.     <div id="d2">  
  18.       <p>这是首行变色</p>  
  19.     </div>  
  20.   </body>  
  21. </html> 
posted @ 2010-11-16 11:18  jhti  阅读(424)  评论(0编辑  收藏  举报