1.root选择器

将样式绑定到页面的根元素中。根元素是指位于文档树中最顶层结构的元素,在HTML页面中就是指包含整个页面的<html>部分。

<style type="text/css">

:root{

background:yellow;

}

body{

background:green;

}

</style>

注意:不使用root选择器来指定root元素的背景色,只指定body元素的背景色,则整个页面就全部变成了绿色。

2.not选择器

如果想对某个结构元素使用样式,但是想排除这个结构元素下面的子结构元素,让它不使用这个样式时,可以使用not选择器。

body*:not(h1){

background:yellow;

}

3.empty选择器

适用empty选择器来指定当元素中内容为空白时使用的样式。

:empty{

background:yellow;

}

4.target选择器

使用target选择器来对页面中某个target元素(该元素的id被当做页面的超链接来使用)指定样式,该样式只在用户点击了页面的超链接,并且跳转到target元素后起作用。

<style type="text/css">

:target{

background:yellow;

}

</style>

<a href="#text1">文字1</a>

<div id="text1">

<h1>文字1</h1>

<p>此处省略100个字</p>

</div>

CSS3中结构伪类选择器——root、not、empty、target选择器的更多相关文章

  1. ::before ::after CSS3中的伪类和伪元素

    ::before和::after伪元素的用法 一.介绍 css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:fo ...

  2. css3中关于伪类的使用

    目标: css中after伪类,last-child伪类的使用.以及部分css3的属性. 过程: 在制作导航时.常常会遇到在每个li后面加入一个切割符号,到最后一个元素的时候,切割符就会去掉的一种效果 ...

  3. css3中的伪类选择器

    一.动态伪类 动态伪类,因为这些伪类并不存在于HTML中,而只有当用户和网站交互的时候才能体现出来,动态伪类包含两种,第一种是我们在链接中常看到的锚点伪类,如":link",&qu ...

  4. CSS3中的伪类选择器详解

      类选择器和伪类选择器区别 类选择器我们可以随意起名,而伪类选择器是CSS中已经定义好的选择器,不可以随意起名. 伪类选择器以及伪元素 我们把它放到这里 p.aaas{ text-align: le ...

  5. 【CSS3】---结构性伪类选择器-root+not+empty+target

    结构性伪类选择器—root :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素.在HTML文档中,根元素始终是<html>. 示例演示: 通 ...

  6. CSS3中only-child伪类选择器

    <body> <style type="text/css"> //只对li1设置样式 li:nth-child(1):nth-last-child(1){ ...

  7. CSS和CSS3中的伪元素和伪类(总结)

    好多人伪类和伪元素分清楚,其实就是一句话,“伪类的效果可以通过添加一个实际的类来达到,而伪元素的效果则需要通过添加一个实际的元素才能达到”. CSS中伪类包括: :first-child :lang ...

  8. CSS中的伪类与伪元素

    在前端开发中,大家或多或少的有接触过CSS伪类和伪元素,使用伪元素的时候,总感觉和伪类很相似,但又不能详细的说出两者的区别和联系,那么两者到底有什么区别和联系呢? 在 W3C 中定义: 伪类:用于向某 ...

  9. 如何使用CSS3中的结构伪类选择器和伪元素选择器

    结构伪类选择器介绍 结构伪类选择器是用来处理一些特殊的效果. 结构伪类选择器属性说明表 属性 描述 E:first-child 匹配E元素的第一个子元素. E:last-child 匹配E元素的最后一 ...

随机推荐

  1. iOS 本地项目上传github,github管理项目配置

    一.注册github账号   首先需要注册一个github账号,注册地址:https://github.com 接着会来到这 然后会收到一封github发的邮件,进入邮箱验证 二.创建个人的githu ...

  2. 后台返回数据事null时怎么进行判断

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #454545 } p. ...

  3. 非常详细的 Docker 学习笔记-转载

    文章链接 一.Docker 简介 Docker 两个主要部件: Docker: 开源的容器虚拟化平台 Docker Hub: 用于分享.管理 Docker 容器的 Docker SaaS 平台 --  ...

  4. lesson - 1 笔记 网络连接 /putty 密钥登陆

    ---笔记 一.网络连接配置 1. 查看电脑ip 地址: ifconfig -a  2. 自动获取ip 地址: dhclient   默认BOOTPROTO=dhcp  和真机同一网段 3. 手动配置 ...

  5. requests爬取网页的通用框架

    概述 代码编写完成时间:2017.12.28 写文章时间:2017.12.29 看完中国大学MOOC上的爬虫教程后,觉得自己之前的学习完全是野蛮生长,决定把之前学的东西再梳理一遍,主要是觉得自己写的程 ...

  6. Linux下创建root权限的账号osadmin

    创建root权限的账号osadmin 命令为: useradd -u 0 -o -g root -G root -d /home/osadmin osadmin 创建成功后验证效果: id osadm ...

  7. 由于DG Broker的配置导致RAC某实例无法mount

    今天碰到一个我自己实验室发生的故障,起初看起来很简单,但实际上还很有趣,而且不细心的话还容易被忽视掉.相信在生产环境也会有客户会实际遇到. 环境:Oracle 11.2.0.4 RAC (2 node ...

  8. VC6.0 突然打不开dsw 工程文件的解决方案

    在vc编程中,经常遇到dsw工程文件无法打开,或者打开后看不到类和变量的问题.特别是把代码从一台电脑上copy到另一台电脑上以后,常常会碰到这种奇怪的问题.有时在编辑状态下也会发生成员变量或函数提示不 ...

  9. day9集合以及这段时间的总结 未完待续

    随笔: # 可变类型:# 列表(可以存放多个值,可以按索引取值,是有序的),# 字典(字典里面是KEY:VALUE类型,key必须是不可变类型,不能按索引取值 因为它们是无序的,按KEY取值),# 集 ...

  10. Augustus安装小记

    之前安装过一次Augustus,由于节点重新部署后,原来安装的硬盘被格掉了,今天重新安装的时候出了一些问题,记录一下. 1. 需要boost,安装好boost之后,虽然将其加入到~/.bashrc配置 ...