关闭

如何定义一段文字的首字或者首行文字的样式

标签: 测试css
897人阅读 评论(0) 收藏 举报
分类:

如何定义一段文字的首字或者首行文字的样式

作者:闪吧   类型:原创   来源:闪吧

  如何定义一段文字的首字或者首行文字的样式
解决思路
首字和首行字分别对应的CSS伪类为:first-letter和:first-line,所以只需要设置对象的两个伪类。 
具体步骤
    代码示例:
    
<style>
p:first-letter{color:green;font-size:24px}
p:first-line{color:red;font-size:12px}
</style>
<p>首字首行伪类定义测试<br>第二行</p>

注意:本例效果只适用于块元素,对于内嵌元素,必须定义position(值为absolute)、width和height属性之一,或者直接设置display属性为block,使内嵌元素转为块元素。
 提示:first-letter和:first-line两个伪类并不仅限于P对象。
特别提示
本例代码运行效果如图2.2.5所示,P对象内的文字第一个字应用了伪类:first-letter定义的样式,而第一行文字(除去第一个)则应用了伪类:first-line定义的样式。

图2.2.5 伪类的应用效果

特别说明


本例用到了两个伪类来解决问题,两伪类的说明如下:
:first-letter设置元素内第一个字符的样式。
:first-line设置元素内第一行字符的样式。 
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:27706次
    • 积分:433
    • 等级:
    • 排名:千里之外
    • 原创:12篇
    • 转载:11篇
    • 译文:0篇
    • 评论:7条
    文章分类
    最新评论