CSS 伪元素用于向某些选择器设置特殊效果。

1、:first-line 伪元素  "first-line" 伪元素用于向文本的首行设置特殊样式。注意："first-line" 伪元素只能用于块级元素。

<html>
<head>
<style type="text/css">p{　　width:400px}
p:first-line
{
color: #ff0000;
font-variant: small-caps
}p{

}
</style>
</head>

<body>
<p>
You can use the :first-line pseudo-element to add a special effect to the first line of a text!wqdd qwd gege sf whwhjssf wrfq hywwvcwef dqivivzvqoiwvduocvqd
</p>
</body>

</html>

2、:first-letter 伪元素  "first-letter" 伪元素用于向文本的首字母设置特殊样式；注意："first-letter" 伪元素只能用于块级元素。类似于：first-line

3、：after 伪元素 ":after" 伪元素可以在元素的内容之后插入新内容。

4、:root 为元素

:root{background:orange}
//等同于
html {background:orange;}

css伪元素的更多相关文章

  1. jQuery如何改变css伪元素样式

    首先我们看一下css伪元素是什么: CSS 伪元素用于向某些选择器设置特殊效果. 伪元素有哪些: :first-line 伪元素:"first-line" 伪元素用于向文本的首行设 ...

  2. css 伪元素分享！！！

    最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...

  3. CSS伪类与CSS伪元素的区别及由来

    关于两者的区别,其实是很古老的问题.但是时至今日,由于各种网络误传以及一些不负责任的书籍误笔,仍然有相当多的人将伪类与伪元素混为一谈,甚至不乏很多CSS老手.早些年刚入行的时候,我自己也被深深误导,因 ...

  4. (六)CSS伪元素

    CSS伪元素用于向某些选择器设置特殊效果. 伪元素的用法和伪类相似: selector:pseudo-element {property:value;} CSS类也可以与伪元素配合使用: select ...

  5. CSS 伪元素

    CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...

  6. js如何控制css伪元素内容（before，after）

    曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...

  7. css伪元素用法大全

    本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...

  8. js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before

    0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

  9. CSS伪元素before、after妙用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 数据结构（树链剖分，线段树）：SDOI 2016 游戏

    4515: [Sdoi2016]游戏 Time Limit: 40 Sec  Memory Limit: 256 MBSubmit: 351  Solved: 157[Submit][Status][ ...

  2. 【模拟】NCPC 2014 E ceremony

    题目链接: http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1791 题目大意: N栋大楼(N<=100000),拆除的时候有两种选择的操作,可 ...

  3. Pet

    Problem Description One day, Lin Ji wake up in the morning and found that his pethamster escaped. He ...

  4. bzoj3223 Tyvj 1729 文艺平衡树（Splay Tree+区间翻转）

    3223: Tyvj 1729 文艺平衡树 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 2202  Solved: 1226[Submit][Sta ...

  5. poj 1149 最大流

    题目链接:http://poj.org/problem?id=1149 #include <cstdio> #include <cmath> #include <algo ...

  6. poj2586

    千年虫病毒 一个财务公司受到电脑病毒攻击所以丢失了一部分年终财务的数据. 他们所有记得的东西都在Inc里面储存着,在1999年之前公司要每个月都贴出盈利和亏损情况.亏损的是d,由于收到了攻击,他们不记 ...

  7. 360. Sort Transformed Array

    一元二次方程...仿佛回到了初中. 主要看a的情况来分情况讨论: =0,一次函数,根据b的正负单调递增递减就行了. <0,凸状..从nums[]左右两边开始往中间一边比较一边 从右往左 放: 0 ...

  8. dubbo源码分析二：服务发布

    本文将深入分析dubbo的服务发布涉及到的流程及主要类的代码.首先,我们先从类的关系图来看一下dubbo发布服务涉及到的相关类. 1.类图 上图展示了部分服务发布过程中需要使用到的类和接口,其中: s ...

  9. 数据库框架 Litepal

    1.导包 dependencies {   compile 'org.litepal.android:core:1.4.1' } 2.在asstes中建立litepal.xml文件 <?xml ...

  10. [Angular 2] ng-model and ng-for with Select and Option elements

    You can use Select and Option elements in combination with ng-for and ng-model to create mini-forms ...