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. request获取各种路径

    equest.getRealPath() 这个方法已经不推荐使用了,代替方法是: request.getSession().getServletContext().getRealPath() 在ser ...

  2. python3编写网络爬虫23-分布式爬虫

    一.分布式爬虫 前面我们了解Scrapy爬虫框架的基本用法 这些框架都是在同一台主机运行的 爬取效率有限 如果多台主机协同爬取 爬取效率必然成倍增长这就是分布式爬虫的优势 1. 分布式爬虫基本原理 1 ...

  3. [WeChall] Training: Crypto - Caesar I (Crypto, Training)

    Training: Crypto - Caesar I (Crypto, Training) Crypto - Caesar I As on most challenge sites, there a ...

  4. Linux 基本操作 （day2)

    一.用户的基本操作 1.添加和删除用户(管理员): useradd  用户名: useradd taibai passwd  用户名: passwd taibai [root@localhost ~] ...

  5. 【SDOI2017】遗忘的集合

    题目描述 好神仙啊,我还真的以为这是个构造题,结果是有唯一解的. 设答案为多项式\(a,a_i\in\{0,1\}\). 则: \[ f(x)=\Pi (\frac{1}{1-x^i})^{a_i} ...

  6. sqrt函数

    import numpy as np B = np.arange(3) print (B) print (np.sqrt(B)) #求平方根

  7. JS函数防抖与函数节流

    概念 函数防抖(debounce) 当调用动作过n毫秒后,才会执行该动作,若在这n毫秒内又调用此动作则将重新计算执行时间 函数节流(throttle) 预先设定一个执行周期,当调用动作的时刻大于等于执 ...

  8. 【编辑器】Visual Studio Code

    1.官网:https://code.visualstudio.com/Download 2.插件:https://marketplace.visualstudio.com/VSCode https:/ ...

  9. mongodb查询的语法（大于，小于，大于或等于，小于或等于等等）

    1 ) . 大于,小于,大于或等于,小于或等于 $gt:大于$lt:小于$gte:大于或等于$lte:小于或等于 例子: db.collection.find({ "field" ...

  10. rabbitMQ常用方法说明 – 6中工作模式及关键点

    首先,RabbitMQ解决什么问题? 1)信息的发送者和接收者如何维持连接,如果一方的连接中断,这期间的数据如何防止丢失? 2)如何降低发送者和接收者的耦合度? 3)如何让Priority高的接收者先 ...