css 伪对象

来源:网络整理 责任编辑:栏目编辑 发表时间:2013-07-01 22:24 点击:
 Pseudo-Elements
:after
:first-letter
:first-line
:before

1.:after
语法:
Selector : after { sRules }
说明:用来和 content 属性一起使用,设置在对象后(依据对象树的逻辑结构)发生的内容。
table:after { content: END OF TABLE }

2.:first-letter
语法:
Selector : first-letter { sRules }
说明:设置对象内的第一个字符的样式。
此伪对象仅作用于块对象。内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。

在此伪对象中配合使用 font-size 属性和 float 属性可以制作首字下沉效果。
p a:first-letter { color: green }
div:first-letter { color:red;font-size:16px;float:left; }

3.:first-line
语法:
Selector : first-line { sRules }
说明:设置对象内的第一行的样式。
此伪对象仅作用于块对象。内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。
如果未强制指定对象的 width 属性, 首行的内容长度可能不是固定的。
eg.
p a:first-line { color: green }
div:first-line { color:red;font-size:16px; }

4.:before
语法:
Selector : before { sRules }
说明:用来和 content 属性一起使用,设置在对象前(依据对象树的逻辑结构)发生的内容。
eg.
em:before { content: url("xx.wav"); }
    发表评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    用户名: 验证码:点击我更换图片
    最新评论 更多>>

    推荐热点

    • 扎实基础 9则css网页制作技巧
    • CSS设计符合Web标准的网页表单的几个技巧
    • 技巧:css星级效果总结
    • 用CSS建设网站的实例(9)
    • 提高网站性能:JavaScript+CSS优化的建议(3)
    • CSS制作网页实例:用CSS控制li标记样式
    网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
    Copyright © 2008-2015 计算机技术学习交流网. 版权所有

    豫ICP备11007008号-1