CSS伪选择器的使用-遁地龙卷风
分为伪元素选择器和伪类选择器两种,前者两个冒号,后者一个冒号,但是浏览器都看做一个冒号
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伪选择器的使用-遁地龙卷风的更多相关文章
- CSS 伪选择器 focus-within 介绍
CSS中的 :focus-within 伪选择器可有点"不寻常",尽管它的名称看上去很简单,而且相当直观.但它的解释是:选择一个包含具有:focus 的任何子元素的元素.有点绕是不 ...
- css伪选择器使用总结——css中关于伪类和伪元素的知识总汇
CSS 伪类用于向某些选择器添加特殊的效果,而CSS引入伪类和伪元素的概念是为了实现基于文档树之外的信息的格式化.这里讲总结关于css伪类和伪元素的相关使用 伪元素 :before/:before 在 ...
- CSS使用自定义光标样式-遁地龙卷风
测试环境是chrome浏览器 Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357. ...
- CSS伪类选择器
一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...
- CSS之旅——第三站 强大的伪选择器
说到伪选择器,真的让我体会到了CSS的无比强大,强大到自己貌似都不认识CSS了,有点C# 6.0中一些语法糖带给我们的震撼...首先 我们可以在VS里面提前预览一下. 可以看到,上面的伪类有很多很多, ...
- 关于CSS伪类选择器
#CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...
- jQuery过滤选择器:first和:first-child的区别,CSS伪类:first-child
最近项目中遇到需求:只在第一列不能删除,不显示小叉号:点击可添加一列,后面的列右上角显示小叉号,可以点击删除. 我是使用以下方法解决这个小需求 :CSS伪类选择器:first-child设置所有小叉号 ...
- CSS伪类选择器 - nth-child(an+b):
CSS伪类选择器 - nth-child(an+b): 第一种:简单数字序号写法:nth-child(number)直接匹配第number个元素.参数number必须为大于0的整数.li:nth-ch ...
- CSS伪类选择器active模拟JavaScript点击事件
一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...
随机推荐
- POJ3928 Pingpong(统计比 K 小的个数 + 树状数组)
Ping pong Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 2691 Accepted: 996 Descript ...
- Hibernate Hql 总结
1.from子句 Hibernate中最简单的查询语句的形式如下: from eg.Cat该子句简单的返回eg.Cat类的所有实例. 通常我们不需要使用类的全限定名, 因为 auto-import(自 ...
- 修改nginx的访问目录以及遇到的403错误修改总结
对于这个问题困扰了我好几天,前篇文章介绍了图片服务器的使用,但是两个服务器如何进行通话访问呢,即如何通过nginx来访问ftp服务器上的资源文件呢,这里面需要修改nginx的配置文件(vi /usr/ ...
- 最小路径(prim)算法
#include <stdio.h>#include <stdlib.h>/* 最小路径算法 -->prim算法 */#define VNUM 9#define MV 6 ...
- bootstrap从phpcmsv9中数据库中取出照片达到自适应的效果
<script type="text/javascript"> $(".col-xs-12 img").addClass("carouse ...
- NAT穿透解决方案介绍
最近公司要实现在各种网络环境下面的多屏互动(机顶盒.android phone.iphone及PC端)的需求:由于IP地址资源有限的原因,目前我们使用的各种终端设备都位于局域网后面也就是多台设备共享同 ...
- CodeForces 459A Pashmak and Garden(水~几何-给两点求两点组成正方形)
题目链接:http://codeforces.com/problemset/problem/459/A 题目大意: 给出两个点(在坐标轴中),求另外两个点从而构成一个正方形,该正方形与坐标轴平行. 如 ...
- 斗鱼的sidebar的实现简陋的demo
斗鱼的sidebar的实现简陋的demo <!DOCTYPE html> <html> <head lang="en"> <meta ch ...
- 用IIS配置反向代理
http://my.oschina.net/tanyixiu/blog/123832 目标服务器:targetServer 配置反向代理的服务器:reveseProxServer 1.确定最终访问的网 ...
- GoLang之网络
GoLang之网络 Go语言标准库里提供的net包,支持基于IP层.TCP/UDP层及更高层面(如HTTP.FTP.SMTP)的网络操作,其中用于IP层的称为Raw Socket. net包的Dial ...