CSS 层级选择器

注：使用空格分隔，塞选到最后一项应用。

标签选择器 下 标签选择器

父标签 --> 指定子标签添加css属性

<html>

<head>

    <!-- style 设置头部标签-->

    <style>

        /*只应用于span标签下的div标签*/

        span div{

               /* 改变背景颜色 */

            background-color: #2459a2;

            /* 改变字体颜色 */

            color: white;

        }

    </style>

</head>

<body>

    <span>

        <div>1</div>

        <div>1</div>

    </span>

</body>

</html>

class选择器 下 标签选择器

含“c1”class属性的标签 --> 内的div标签设置css样式

<html>

<head>

    <!-- style 设置头部标签 -->

    <style>

        /*含有.c1样式下的div标签有效 */

        .c1 div{

                /* 改变背景颜色 */

            background-color: #2459a2;

             /* 改变字体颜色 */

            color: white;

        }

    </style>

</head>

<body>

    <span class="c1">

        <div>1</div>

        <div>1</div>

    </span>

</body>

</html>

CSS 层级选择器的更多相关文章

  1. 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器

    × 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...

  2. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  3. JQuery学习笔记——层级选择器

    JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...

  4. 前端之CSS介绍--选择器

    一.CSS简介 介绍 css我们称呼层叠样式表(英文全称:Cascading Style Sheets).它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等 ...

  5. css样式——选择器（三）

    https://www.cnblogs.com/haiyan123/p/7552235.html 1.怎么找到标签 2.如何操作标签的对象 一.css概述 CSS是Cascading Style Sh ...

  6. 小tip: CSS后代选择器可能的错误认识——张鑫旭

    一.关于类选择器的一个问题 假设有下面一个面试题,CSS代码如下: .red { color: red; } .green { color: green; } HTML如下: <div clas ...

  7. 前端基础：CSS样式选择器

    前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...

  8. 什么是 jQuery 和jQuery的基本选择器，层级选择器，基本筛选器

    jQuery是什么? ［1］   jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. ［2］   jQuery是继prototype ...

  9. jquery 层级选择器

    关于层级选择器. $("parent > child") 选择所有指定“parent”元素中指定的“child”的直接子项元素. parent :任何有效的选择器. chil ...

随机推荐

  1. 学习Vue 入门到实战——学习笔记

    闲聊: 自从进了现在的公司,小颖就再没怎么接触vue了,最近不太忙,所以想再学习下vue,就看了看vue相关视频,顺便做个笔记嘻嘻. 视频地址:Vue 入门到实战1.Vue 入门到实战2 学习内容: ...

  2. 接口配置信息修改 请填写接口配置信息，此信息需要你有自己的服务器资源，填写的URL需要正确响应微信发送的Token验证

    // 1)将token.timestamp.nonce三个参数进行字典序排序 // 2)将三个参数字符串拼接成一个字符串进行sha1加密 // 3)开发者获得加密后的字符串可与signature对比, ...

  3. pandas读取文件报错

    path = 'D:/Postgraduate/Python/Machine Learning/小象学院机器学习/08.回归实践/8.Regression代码/8.Regression/8.Adver ...

  4. mui 窗口管理及窗口之间的数据传递

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  5. .net 平台 统计图表展示控件fusioncharts

    https://www.fusioncharts.com/javascript-chart-fiddles/

  6. RoR - Advanced Querying

    Seeding the Database: db/seed.rb 可以提供预设data rake db:seed #seeds.rb Person.create! [ {first_name : &q ...

  7. 洛谷P1021邮票面值设计 [noip1999] dp+搜索

    正解:dfs+dp 解题报告: 传送门! 第一眼以为小凯的疑惑 ummm说实话没看标签我还真没想到正解:D 本来以为这么多年前的noip应该不会很难:D 看来还是太菜了鸭QAQ 然后听说题解都可以被6 ...

  8. ASP.NET C# 如何在程序中控制IIS服务或应用程序池重启？

    停止IIS服务ServiceController sc = new ServiceController("iisadmin");if(sc.Status==ServiceContr ...

  9. [js]设计模式小结&对原型的修改

    js设计模式小结 工厂模式/构造函数--减少重复 - 创建对象有new - 自动创建obj,this赋值 - 无return 原型链模式 - 进一步去重 类是函数数据类型,每个函数都有prototyp ...

  10. 解决Windows下文件在Linux下打开出现乱码的问题

    目录 问题 原理 解决 总结 参考资料 问题 前几天生病了,Java一直在看代码但是没跟着打,于是决定偷一波小小的懒,直接把教材的代码从Windows通过共享文件夹放到了Linux里面.但是编译的时候 ...