分为伪元素选择器和伪类选择器两种,前者两个冒号,后者一个冒号,但是浏览器都看做一个冒号

1.a.::first-line

逐层匹配,直到有文本元素且结束改行为止

设置css属性word-break:break-all、文本长度超出元素的例子就不说了

body::first-line
{
color:red;
}

(1)
<body>
  <p id="lol">
    <span><i>123</i><br/><i>123</i></span><br/>
  </p>

</body>
第一个i标签变红

(2)
<body>
  <p id="lol">
    123<br/><!--变红-->
    <span><i>123</i><br/><i>123</i></span><br/>
  </p>
</body>

未完待续!

欢迎指正!

CSS伪选择器的使用-遁地龙卷风的更多相关文章

  1. CSS 伪选择器 focus-within 介绍

    CSS中的 :focus-within 伪选择器可有点"不寻常",尽管它的名称看上去很简单,而且相当直观.但它的解释是:选择一个包含具有:focus 的任何子元素的元素.有点绕是不 ...

  2. css伪选择器使用总结——css中关于伪类和伪元素的知识总汇

    CSS 伪类用于向某些选择器添加特殊的效果,而CSS引入伪类和伪元素的概念是为了实现基于文档树之外的信息的格式化.这里讲总结关于css伪类和伪元素的相关使用 伪元素 :before/:before 在 ...

  3. CSS使用自定义光标样式-遁地龙卷风

    测试环境是chrome浏览器 Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357. ...

  4. CSS伪类选择器

    一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...

  5. CSS之旅——第三站 强大的伪选择器

    说到伪选择器,真的让我体会到了CSS的无比强大,强大到自己貌似都不认识CSS了,有点C# 6.0中一些语法糖带给我们的震撼...首先 我们可以在VS里面提前预览一下. 可以看到,上面的伪类有很多很多, ...

  6. 关于CSS伪类选择器

    #CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...

  7. jQuery过滤选择器:first和:first-child的区别,CSS伪类:first-child

    最近项目中遇到需求:只在第一列不能删除,不显示小叉号:点击可添加一列,后面的列右上角显示小叉号,可以点击删除. 我是使用以下方法解决这个小需求 :CSS伪类选择器:first-child设置所有小叉号 ...

  8. CSS伪类选择器 - nth-child(an+b):

    CSS伪类选择器 - nth-child(an+b): 第一种:简单数字序号写法:nth-child(number)直接匹配第number个元素.参数number必须为大于0的整数.li:nth-ch ...

  9. CSS伪类选择器active模拟JavaScript点击事件

    一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...

随机推荐

  1. BigDecimal数据加法返回值接收

    1.相加 两个BigDecimal变量a,b. 如果想进行相加,即a加b的话,返回值需要使用a进行接收,如下: a = a.add(b); BigDecimal为不可变类, 所以执行运算的结果需要再返 ...

  2. Ztree的简单使用和后台交互的写法(一)

    一.引入ztree的头文件 <!-- 引入ztree/--> <script type="text/javascript" src="${pageCon ...

  3. OC面向对象特性: 继承

    基础知识 1.标识符是有字母,数字,下划线组成的. 2.首字母只能是字母,下划线,不能为数字. 3.标识符要做到见名之意. 4.标识符不能使用已定义的关键字和预定义标识符. 继承 继承:子类可以直接访 ...

  4. 20145212 实验五《Java网络编程》

    20145212 实验五<Java网络编程> 一.实验内容 1.运行下载的TCP代码,结对进行,一人服务器,一人客户端: 2.利用加解密代码包,编译运行代码,一人加密,一人解密: 3.集成 ...

  5. 关于软件工程结对编程作业 PairProject : Elevator Scheduler(电梯调度算法的实现与测试)的总结

    1)结对编程队友 1106xxxx 张扬 1106xxxx 杨军 其中,此项目的编程实现主要由前者完成. 2)关于结对编程 结对编程的优点: 最直接的一点:在结对编程中,由于有另一个人在你身边和你配合 ...

  6. HDFS的Java操作

    实验环境: Windows 10 Eclipse Mars.2 Release (4.5.2) CentOS 7 Hadoop-2.7.3 先决条件: 1) Windows上各环境变量已配置OK.   ...

  7. 一种nodejs的MVC框架

    mvc会针对请求进行分发,分发一般有controller(针对模块),action(针对模块中的方法),args(请求的参数). 1.先对http请求的url进行设置,解析url中的各种参数: //c ...

  8. Vim以及Terminal 配色方案---"Solarized"配色

    linux用户给vim 以及terminal的配色方案---Solarized配色 官网地址:http://ethanschoonover.com/solarized 看这配色:八卦乾坤,赏心悦目,高 ...

  9. Robot Framework--09 分支与循环的用法

    转自:http://blog.csdn.net/tulituqi/article/details/8038923 一.分支 在Robotframework2.7.4之前的版本,我们要想写IF比较容易, ...

  10. Only one statement is allowed per batch. A batch separator, such as 'GO', might be required between statements.

    When I added the file in VS I forgot to set Build Action = None from the file properties.