:empty css 可以用在哪些标签,CSS3 :empty 选择器

这可是个好东西,我也是这个星期才发现的,下面我们来说具体功能。

p:empty

{

width:100px;

height:20px;

background:#ff0000;

}

A paragraph.

Another paragraph.

知道这代码运行后是怎样的吗?我们来看效果。

31e9ddb624121f7fd28dc4a697a84df4.png

p标签里有内容的,就没有运行下面的代码,但是没有内容的p标签,渲染成了红色。

p:empty

{

width:100px;

height:20px;

background:#ff0000;

}

大家通过上面的例子,也能猜出这个伪类有什么作用了吧。没错,:empty选择器选择每个没有任何子级的元素(包括文本节点)。

我们来看下兼容性怎么样,要是兼容性不好,再大作用也是扯淡。下面是来自w3c的截图

af5645b7120316a4af429278822b7374.png

哇,兼容性很不错哦!!ie9以下不兼容,但是有什么关系呢!谁让它叫做ie呢。珍爱生命,远离ie

CSS系列:CSS3新增选择器

1. CSS1定义的选择器 选择器 类型 说明 E 类型选择器 选择指定类型的元素 E#id ID选择器 选择匹配E的元素,且匹配元素的id为“id”,E选择符可以省略. E.class 类选择器 选 ...

CSS3常用选择器(一)

在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素.比如最常用到的#id,.class,标签选择器. 随着CSS3到来,增加了很多新型选择器,这里就常用的做一个总结. 1.属性选择器. 在c ...

CSS3属性选择器与(:not)选择器

一:css3属性选择器: img[alt]{ border:2px dashed #000; } 这个选择器会匹配页面标签中任何一个含有alt属性的图片标签.   还可以通过设定属性值来缩小匹配范围: ...

【前端开发系列】—— CSS3属性选择器总结

想想自己为什么要学CSS,作为一个开发过前端的人员来说,调试一个图片花了半天的时间,最后发现分隔符用错了,实在是一件很丢人的事情.因此,痛下决心来学习CSS,最近一周也会更新下相关的学习笔记. CSS ...

CSS3之选择器

总结了下CSS3新增的一些选择器. CSS3的选择器有基本选择器.属性选择器.伪类选择器几类. CSS3选择器 选择器 举例 例子描述 element1~element2 p~a 选择前面有 < ...

CSS3选择器02—CSS3部分选择器

该部分主要为CSS3新增的选择器 接上一篇 CSS(CSS3)选择器(1) 一.通用兄弟选择器: 24:E ~ F,匹配任何E元素之后的同级F元素. div ~ p{ background-color ...

CSS3 教程 选择器 标记一下防止 要找时404

客 » Airen的博客 CSS3 选择器——基本选择器 作者:大漠 日期:2011-08-09 点击:6418  CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运 ...

CSS选择器及CSS3新增选择器

转自:http://www.cnblogs.com/libingql/p/4375354.html 1. CSS1定义的选择器 选择器 类型 说明 E 类型选择器 选择指定类型的元素 E#id ID选 ...

&lbrack;CSS3&rsqb;移动Web开发系列之CSS3增强型选择器

css3是移动Web开发的主要技术之中的一个.当前.CSS3技术最适合在移动Web开发中使用的特性有增强的选择器.阴影.强大的背景设置 .圆角边框 接下来我们主要解说增强型的选择器.主要分两种,属性选 ...

随机推荐

爬虫技术 -- 进阶学习(十)网易新闻页面信息抓取(htmlagilitypack搭配scrapysharp)

最近在弄网页爬虫这方面的,上网看到关于htmlagilitypack搭配scrapysharp的文章,于是决定试一试~ 于是到https://www.nuget.org/packages/Scrapy ...

windows 下 新建 点开头的文件和文件夹

新建 .aaa文件夹 cmd:$ mkdir .aaa 新建 .aaa文件夹 echo " >> .aaa

Sql server 2008镜像配置步骤

下面主要是2008 MSSQL的一个镜像安装步骤,使用到的工具是mssql自带的Management Studio purpose : SQL SERVER 2008 mirror configura ...

Shell Sort(草稿)

using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Shel ...

IAR EWARM PRINTF&sol;SCANF FORMATTER

The linker automatically chooses an appropriate formatter for printf- and scanf-related function bas ...

【前端】&colon;css

前言: 关于前端的第二篇博客,会写关于css的,内容比较基础.写完这篇博客,会做一个类似美乐乐家具的界面.good luck to me~ 一.css-引用样式 标签上设置style属性:

基于QT的异质链表实例

所谓的异质链表就是的节点元素类型能够不同.本实例採用C++抽象类和多态实现. #include #include #in ...

python中&lowbar;&lowbar;name&lowbar;&lowbar;

1.在运行程序时一般会写 if __name__ == "__main__" 当一个py文件被程序当做模块导入时,python会将文件中的代码执行一遍,如果我们在py文件中写了一些 ...

基于SurfaceView的可拖动视频控件

视频播放控件(一) 可拖动,变换SurfaceView public class DragSurfaceView extends SurfaceView implements View.OnTouch ...

Chrome查看HTTP

查找cookie 补充: 接口调试使用postman挺不错的.以前每次都自己写一个ajax来进行接收调试. 如:用post发送json数据给接口,得到json数据. 工具有时候能让效率大大提升,要学会 ...

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值