12-后代选择器


我是段落

我是段落

我是段落

  • 我是段落

  • 我是段落

我是段落

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>12-后代选择器</title>

    <style>

        /*

        div p{

            color: red;

        }

        */

        /*

        #identity p{

            color: red;

        }

        */

        /*

        .para p{

            color: blue;

        }

        */

        /*

        #identity #iii{

            color: skyblue;

        }

        */

        /*

        #identity .ccc{

            color: purple;

        }

        */

        div ul li p{

            color: red;

        }

    </style>

</head>

<body>

<!--

1.什么是后代选择器?

作用: 找到指定标签的所有特定的后代标签, 设置属性

格式:

标签名称1 标签名称2{

    属性:值;

}

先找到所有名称叫做"标签名称1"的标签, 然后再在这个标签下面去查找所有名称叫做"标签名称2"的标签, 然后在设置属性

div p{}

注意点:

1.后代选择器必须用空格隔开

2.后代不仅仅是儿子, 也包括孙子/重孙子, 只要最终是放到指定标签中的都是后代

3.后代选择器不仅仅可以使用标签名称, 还可以使用其它选择器

4.后代选择器可以通过空格一直延续下去

-->

<!--div ul li p-->

<p>我是段落</p>

<div id="identity" class="para">

    <p>我是段落</p>

    <p>我是段落</p>

    <ul>

        <li>

            <!--<p id="iii" class="ccc">我是段落</p>-->

            <p>我是段落</p>

        </li>

        <li>

            <p>我是段落</p>

        </li>

    </ul>

</div>

<p>我是段落</p>

</body>

</html>

H5 后代选择器的更多相关文章

  1. 子代选择器（>）后代选择器（' '）的区别

    子代选择器是指紧接着父级的那个标签,如:container>a指的是紧接着container后面的第一个a(儿子级别的,孙子或者之后的a是不能生效的) 后代选择器是用空格分开的,如:contai ...

  2. CSS后代选择器可能的错误认识

    一.关于类选择器的一个问题 CSS代码: .red { color: red; } .green { color: green; } HTML代码: <div class="red&q ...

  3. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

  4. 【学】jQuery的源码思路1——后代选择器

    jQuery的源码思路1--后代选择器 这里探讨一下jQuery中后代选择器的封装原理,并自己写一下 getEle('#div1 ul li .box');接受的参数就是个后代选择器,类似于这样: # ...

  5. css后代选择器（div.class中间不带空格）

    如果我要查找<div>上用了.class的元素,查找方法:div.class:中间是不空格的. 以上这种形式为css后代选择器 参考:http://www.w3school.com.cn/ ...

  6. jquery :checked(过滤选择器) 和 空格:checked(后代选择器)

    jquery 过滤选择器 和 后代选择器 <%@ page language="java" contentType="text/html; charset=UTF- ...

  7. CSS后代选择器,子选择器和相邻兄弟选择器

    平时在代码练习中,经常用到后代选择器,子选择器也会用到,这里做个总结: 1,后代选择器和子选择器区别: ①写法不一样:后代选择器的标识为:空格 如:ul li{width:150px;} [ul和li ...

  8. css——子代与后代选择器

    一直都以为,子代选择器与后代选择器作用是一样的,都是选择一个元素下面的子元素,直到今天才明白: 1.子代选择器(用<连接):ul>li 子选择器仅仅选择ul包围的 子元素 中的 li元素, ...

  9. CSS 子元素选择器与后代选择器区别实例讲解

    css子元素选择器和后代选择器在功能描述上非常相同,但是他们其实是有区别的,本文章通过两个简单的实例向大家介绍子元素选择器与后代选择器的区别,需要的朋友可以参考一下. 首先我们来了解一下子元素选择器与 ...

随机推荐

  1. ntohs, ntohl, htons,htonl对比

    ntohs =net to host short int 16位htons=host to net short int 16位ntohl =net to host long int 32位htonl= ...

  2. postgre中类似oracle的sql%rowcount用法

    get diagnostics cnt := row_count; 现在有两个表tab1和tab2,两个表的格式相同,tab1中有1000条数据,tab2中0条数据 创建测试功能函数 create o ...

  3. 教你用Python Jupyter Notebook 制作代码分享 PPT

    PPT 是个强大的工具,但是笔者的 PPT 制作技术不咋地,所以之前的分享习惯使用 Jupyter Notebook + RISE,这样使用简单的 markdown 格式加上代码就足够做一次代码分享了 ...

  4. 详解PHP中的过滤器（Filter）

    PHP 过滤器用于验证和过滤来自非安全来源的数据,比如用户的输入. 什么是 PHP 过滤器? PHP 过滤器用于验证和过滤来自非安全来源的数据. 验证和过滤用户输入或自定义数据是任何 Web 应用程序 ...

  5. Linux系统将服务器时间与网络时间同步

    遇到一种情景,就是多台服务器之间的时间并不是同步的,有的快有的慢,这时候就要用到网络时间了, 登陆到服务器上,输入命令date可以查询服务器的时间,需要同步的时候需要安装ntpdate; 1.  安装 ...

  6. kafka_2.11-2.0.0_安装部署

    参考博文:kafka 配置文件参数详解 参考博文:Kafka[第一篇]Kafka集群搭建 参考博文:如何为Kafka集群选择合适的Partitions数量 参考博文:Kafka Server.prop ...

  7. syslog的坑

    先看看代码: g_log, err := syslog.NewLogger(syslog.LOG_INFO, ) 再看看syslog的源码: // NewLogger creates a log.Lo ...

  8. SecureCRT8.1+SecureCRT_keygen完成注册

    原文:https://www.cnblogs.com/qiyawei/p/7822957.html 1.下载完secureCRT8.1之后,进行安装. 点击secureCRT.exe的时候会出现如下图 ...

  9. 近日使用Taro框架的一点小心得

    1.yarn npm安装的包,跟权限问题有关,与网络也有关 2.Vue框架首先,是解决了view-model的问题,解放开发的双手,使得显示和数据和控制分开 3.当你觉得最近没有技术文章看时,就看收藏 ...

  10. Spring获取实现某接口的所有实例bean

    1.获取 applicationContext,通过ApplicationAware自动注入 2.getBeansOfType.getBeanNamesForType Map<String, I ...