之前用的css没涉及到这个问题,今天看到。知道大概用法,但不知道和普通的后代选择器有什么区别。到网上找了,其实w3c的css文档里有很详细明确的介绍(http://www.w3school.com.cn/css/css_selector_child.asp)。

这里写下全做加深印象:

如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用子元素选择器(Child selector)。

例如,如果您希望选择只作为 h1 元素子元素的 strong 元素,可以这样写:

    h1 > strong {color:red;}

这个规则会把第一个 h1 下面的两个 strong 元素变为红色,但是第二个 h1 中的 strong 不受影响:

   <h1>This is <strong>very</strong> <strong>very</strong> important.</h1>
<h1>This is <em>really <strong>very</strong></em> important.</h1> 以下来自其他:
   打个比方div span{color:red;}这样写,div下的不论是儿子辈的span还是孙子辈的span都应用所写的样式,也就是说,div下的所有span都有这个样式。 而div > span{...}这样写,div下的只有儿子辈的span应用所写的样式;
   但是如果是这种情况<div><span>dddddd<span>aaaaa</span></span></div>最内层的孙子辈(相对div说)的span会继承儿子辈的span样式;虽然aaaaa显示的之前定义的div span{color:red;}的红色,但其实还是受外层span的影响。
												

关于css里大于号(>)的用法的更多相关文章

  1. 说说CSS样式中你不知道的“大于号”

    继承在一定程度上让程序在编写的过程中更加方便,但是有时候也会给我们的程序带来一定的困扰,所以认真的学习继承的原理,以及处理的方法很重要.下面是Css中处理继承的一个方法.在一段CSS代码中见到一个大于 ...

  2. CSS样式中” 大于号”

    CSS样式中” 大于号” 在一段CSS代码中见到一个大于号(>),代码如下: BODY#css-zen-garden > DIV#extraDiv2 { BACKGROUND-IMAGE: ...

  3. 1:CSS中一些@规则的用法小结 2: @media用法详解

    第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下     at-rule ...

  4. xml文件sql中大于号、小于号、等号的转义问题

    1.用小于或小于等于的场景 代码1: <delete id="delOvertimeLog" parameterType="java.lang.Integer&qu ...

  5. mybatis使用时遇到的一些问题------模糊查询、处理大于号小于号、相关函数替换空值

    在mybatis中可能会用到的方法 1.模糊查询 <select id="showByIdName" parameterType="User" resul ...

  6. html5 css选择器 井号, 句点的区别

    一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...

  7. mybatis在XML中大于号转义字符

    mybatis在编写sql时不能在XML里直接使用‘<’ 或者是 ‘>’ 在这里需要使用转义字符替换 下面列举常用的xml转义对应: * <           <       ...

  8. 关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案

    最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果.遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Conte ...

  9. jquery选择器空格与大于号、加号与波浪号的区别

    空格:$('parent childchild')表示获取parent下的所有的childchild节点,所有的子孙. 大于号:$('parent > child')表示获取parent下的所有 ...

随机推荐

  1. 人人都是 API 设计师:我对 RESTful API、GraphQL、RPC API 的思考

    原文地址:梁桂钊的博客 博客地址:http://blog.720ui.com 欢迎关注公众号:「服务端思维」.一群同频者,一起成长,一起精进,打破认知的局限性. 有一段时间没怎么写文章了,今天提笔写一 ...

  2. Spark 学习笔记之 map/flatMap/filter/mapPartitions/mapPartitionsWithIndex/sample

    map/flatMap/filter/mapPartitions/mapPartitionsWithIndex/sample:

  3. Kafka 学习笔记之 Consumer API

    Kafka提供了两种Consumer API High Level Consumer API Low Level Consumer API(Kafka诡异的称之为Simple Consumer API ...

  4. 从零开始的vue学习笔记(四)

    组件注册 组件名 Vue.component('my-component-name', { /* ... */ }) 这里的my-component-name就是组件名,组件名的取法可以参考指南 ke ...

  5. 《Java语言程序设计》编程练习8.9(游戏:#字游戏)

    8.9 (游戏:#字游戏)在并字游戏中,两个玩家使用各自的标志(一方用X则另一方就用O),轮流填写3x3的网格中的某个空格.当一个玩家在网格的水平方向.垂直方向或者对角线方向上出 现了三个相同的X或三 ...

  6. opencv之膨胀与腐蚀

    腐蚀和膨胀 Erosion/Dilation erosion/dilation,用白话说,就是让图像亮的区域收缩和扩张. 原理 我们定义一个卷积核矩阵.这个矩阵可以是任何形状的,但通常而言,是矩形或者 ...

  7. Pillow模块图片生成

    0825自我总结 Pillow模块图片生成 一.模块安装 pip3 install pillow 二.模块的载入 import PIL 三.django结合img标签生成图片 img.html < ...

  8. 《深入理解Java虚拟机》-----第13章 线程安全与锁优化

    概述 在软件业发展的初期,程序编写都是以算法为核心的,程序员会把数据和过程分别作为独立的部分来考虑,数据代表问题空间中的客体,程序代码则用于处理这些数据,这种思维方式直接站在计算机的角度去抽象问题和解 ...

  9. 机器学习:weka中Evaluation类源码解析及输出AUC及交叉验证介绍

    在机器学习分类结果的评估中,ROC曲线下的面积AOC是一个非常重要的指标.下面是调用weka类,输出AOC的源码: try { // 1.读入数据集 Instances data = new Inst ...

  10. API 网关的选型和持续集成

    2019 年 8 月 31 日,OpenResty 社区联合又拍云,举办 OpenResty × Open Talk 全国巡回沙龙·成都站,APISIX 作者温铭在活动上做了< API 网关的选 ...