0 Comments

实例解析CSS选择符及其用法(4)

发布于:2013-11-06  |   作者:广州网站建设  |   已聚集:人围观
伪对象选择符(CSSPseudo-ElementsReference)

 

语法:(CSS选择符中的伪对象选择符共有4种)

1.Selector:first-letter
2.Selector:first-line
3.Selector:before
4.Selector:after

说明:

1.设置对象内的第一个字符的样式表属性。此伪对象仅作用于块元素。内联元素要使用该伪对象,必须先设定对象具有块元素的表状。

2.设置对象内的第一行的样式表属性。此伪对象仅作用于块对象。内联对象要使用该伪对象,必须先设定对象具有块元素的表状。

3.用来和content属性一起使用,设置在对象前(依据对象树的逻辑结构)发生的内容。

4.用来和content属性一起使用,设置在对象后(依据对象树的逻辑结构)发生的内容。

这几个伪对象选择符都为属于CSS2选择符,其中:first-letter和:first-line目前所有主流浏览器均支持;:before和:after非IE核心浏览器及IE8支持。
广州网站建设,网站建设,广州网页设计,广州网站设计

实例:


  1. div:first-letter{color:#f00;}  
  2. <div>我是一只丑小鸭,伊啊伊啊哟</div> 
  3.  
  4. div:first-line{color:#f00;}  
  5. <div>我是一只丑小鸭,伊啊伊啊哟</div> 
  6.  
  7. div:before{content:"web";}  
  8. <div>前端开发</div> 
  9.  
  10. div:after{content:"...";}  
  11. <div>大段的文字</div> 
飞机