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. Android中ListView分页加载数据

    public class MainActivity extends Activity { private ListView listView=null; //listview的数据填充器 privat ...

  2. NOI题库1814 恼人的青蛙

    1814:恼人的青蛙 总时间限制: 2000ms 单个测试点时间限制: 500ms 内存限制: 65536kB 描述 在韩国,有一种小的青蛙.每到晚上,这种青蛙会跳越稻田,从而踩踏稻子.农民在早上看到 ...

  3. 由浅入深吃透MVC框架,驯服烂代码

    MVC 已经成为客户端的主流编程框架,相信客户端工程师对它并不陌生,甚至在开发过程中,不通过思考都会自动使用 MVC 框架编程.但在工作过程中,发现许多小伙伴也只是使用 MVC,对于为什么这样使用并不 ...

  4. 启动tomcat时报classpath not found

    启动tomcat时报classpath  not found 原因是缺包,首先查看tomcat安装地址,然后找到webapps目录下,找到该项目,看lib下是否缺包,不能单纯的看项目下是否缺包.

  5. iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。

    实现一个依据iframe页面返回充值卡类型不同,安排不同的input部件. 点击选择弹出一个iframe.点击充值卡数据行.返回1.充值卡类型.2.充值卡id(用的UUID).3.充值卡号(字符串). ...

  6. 我的搜索优化记录(一):中文分词优化IK Analyzer

    搜索绝对不仅仅是搭起框架,跑出结果就完成的工作,之后分词.排序等等的优化才是重头戏. 先交代下背景:这个搜索是我一个人负责搭建并优化的项目,主要索引对象为歌曲.歌手MV等等. 使用技术:Lucene. ...

  7. 在Ubuntu上安装使用Systemtap

    因为最近开始学习Nginx,在网上看到别人介绍了一款强大的内核探测工具Systemtap,于是便准备学习下这款探测工具为以后代码分析做准备. 第一步便是安装.在自己电脑上安装的时候,也是费了一番劲儿. ...

  8. session在登录中的使用

    package action.exam; import java.util.Map; import com.opensymphony.xwork2.ActionContext; import com. ...

  9. jsp中的c标签

    核心标签库 引用: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> ...

  10. jsonp Ajax跨域请求

    什么是JSONP? JSONP(JSON with Padding)是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域 ...