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. wait和waitpid的使用和区别

    昨天看到一则新闻,讲的是一个游戏开发大拿猝死去世的新闻,公司发了讣告,打算接下去给他爸爸妈妈每个月10000的赡养费,很是感慨,本来中国的游戏业和国外就差距大,天妒英才啊.真心想对那些游戏公司的领导说 ...

  2. linux防火墙 基础知识

    转 http://drops.wooyun.org/tips/1424 iptables介绍 linux的包过滤功能,即linux防火墙,它由netfilter 和 iptables 两个组件组成. ...

  3. String.Split()函数

    我们在上次学习到了 String.Join函数(http://blog.csdn.net/zhvsby/archive/2008/11/28/3404704.aspx),当中用到了String.SPl ...

  4. TI C66x DSP 系统events及其应用 - 5.10(创建ISR的三种情况)

    ISFP是服务中断的指令包,创建ISR的三种情况: 1.一个ISFP包的8条指令就能够满足ISR watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWl5ZW ...

  5. Qt 学习之路:QSortFilterProxyModel

    从本章开始,我们将逐步了解有关自定义模型的相关内容.尽管前面我们曾经介绍过 Qt 提供的几个内置模型:QStringListModel和QFileSystemModel,但对于千变万化的需求而言,这些 ...

  6. 多线程下的NSOperation和NSOperationQueue的使用

    多线程下的NSOperation和NSOperationQueue的使用 NSOperation和NSOperationQueue的介绍: NSOperation是Cocoa中的一个抽象类,用来封装单 ...

  7. 第四篇:SQL

    前言 确实,关于SQL的学习资料,各类文档在网上到处都是.但它们绝大多数的出发点都局限在旧有关系数据库里,内容近乎千篇一律.而在当今大数据的浪潮下,SQL早就被赋予了新的责任和意义. 本篇中,笔者将结 ...

  8. Swift: The Basics

    Swift是类型安全的语言: Swift introduces optional types, which handle the absence of a value. Optional say ei ...

  9. 微信小程序开发工具(0.9.092300)下载地址,分享给没有公众号的小伙伴

    目前最新的v0.9.092300,不需要填AppID就能直接开发,也不需要破解了. OSX版本.WIN64.WIN32下载地址: http://pan.baidu.com/s/1qXOdkgG

  10. android SDK开发 -- TitleBar封装(一)

    假设app的title 统一的都是这种左中右结构的 代码如下 <LinearLayout xmlns:android="http://schemas.android.com/apk/r ...