first-line   设置首行样式

first-letter 设置首字母样式

before  在某元素前插入内容并设置内容样式

after 在某元素后插入内容并设置内容样式

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

   <style>

      p:first-line{background: #CCFFCC;}

       p:first-letter{color:red;}

       p:before{ content: "前";}

       p:after{content: "后";font-size: 50px;}

   </style>

</head>

<body>

实例:

<p>第一行 <br />第二行</p>

</body>

</html>

CSS3伪类选择器的更多相关文章

  1. CSS3 伪类选择器 nth-child() 的用法

    伪类选择器 nth-child() 在IE6-8和FF3.0-浏览器不支持,CSS3中nth-of-type(n)(比如nth-of-type(1))这个特殊的类选择符可以样式更加个性的标题和段落等, ...

  2. jQuery实现隔行变色、悬停变色 （ CSS3伪类选择器：nth-child() ）

    <title>实现隔行变色</title> <script src="Js/jquery-1.8.0.min.js" type="text/ ...

  3. 巧用CSS3伪类选择器自定义checkbox和radio的样式

    由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...

  4. CSS3伪类选择器：nth-child()（nth-child(odd)/nth-child(even)）

    nth-child(odd):奇数 nth-child(even):偶数 使用时,如果是精确到数字时,切记是从同一级别的元素开始计算,而不是指定某个类才开始计算. 比如: <li>< ...

  5. CSS3 伪类选择器 :nth-child()

    :nth-child()可以选择某个的一个或多个特定的子元素,你可以按这种方式进行选择: :nth-child(length);/*参数是具体数字*/ :nth-child(n);/*参数是n,n从0 ...

  6. CSS3伪类选择器 图示

         

  7. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  8. CSS动态伪类选择器温故

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  9. CSS3 nth 伪类选择器

    考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</s ...

随机推荐

  1. JSON WEB TOKENS

    用JWT来保护我们的ASP.NET Core Web API   在上一篇博客中,自己动手写了一个Middleware来处理API的授权验证,现在就采用另外一种方式来处理这个授权验证的问题,毕竟现在也 ...

  2. Querying mergeinfo requires version 3 of the FSFS filesystem schema

    环境: jdk 1.7; svn  3.0.4;  TortoiseSVN 1.7.13 Subversion 1.7.10; IntelliJ IDEA 13.1.1;win7 64位系统 之前那个 ...

  3. Netsharp快速入门(之3) 基础档案(之B 实体建模 新建项目)

    作者:秋时 杨昶   时间:2014-02-15  转载须说明出处 3.3     创建业务模型 3.3.1  新建项目 1.打开业务模型 2.打开业务模型后,在工具栏上选择操作-新增项目分类,标识这 ...

  4. WPF入门学习

    WPF基础知识 总结的学习WPF的几点基础知识: 1) C#基础语法知识(或者其他.NET支持的语言):这个是当然的了,虽然WPF是XAML配置的,但是总还是要写代码的,相信各位读者应该也都有这个基础 ...

  5. Struts2中的ModelDriven机制及其运用(转)

    所谓ModelDriven,意思是直接把实体类当成页面数据的收集对象.比如,有实体类User如下: package cn.com.leadfar.struts2.actions; public cla ...

  6. 使用python远程登录

    最近要使用python做一个在web上管理交换机的程序,需要远程登录,就查了点资料,由于还没有搞到交换机,就先用自己的机器测试一下. 首先python的标准库中包含telnet,用起来也很方便,查看一 ...

  7. WebServices中Xml的序列化

    一.定义序列化实体类 [System.Xml.Serialization.XmlRoot("Custome_Xml_Root_Name")] //自定义生成的Xml根目录名称 pu ...

  8. Visual Studio快捷键设置

    1.查看当前快捷键:环境-键盘-按快捷键2.文本编辑器-C#-显示-行号3.文本编辑器-C#-制表符-插入空格4.文本编辑器-所有语言-没有选定内容时对空行应用剪切或复制命令5.Ctrl+Shift- ...

  9. Codeforce 438D-The Child and Sequence 分类： Brush Mode 2014-10-06 20:20 102人阅读 评论(0) 收藏

    D. The Child and Sequence time limit per test 4 seconds memory limit per test 256 megabytes input st ...

  10. tomcat错误：@HandlesTypes annotation of one or more ServletContentInitializers

    项目在别人的机器上运行正常,但是在自己机器上运行出现该错误,所以判断应该是环境配置的问题,通过更换eclipse.更换jdk.更换maven.更换tomcat的不同版本,最终确认是tomcat的问题. ...