关于css里大于号(>)的用法
之前用的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里大于号(>)的用法的更多相关文章
- 说说CSS样式中你不知道的“大于号”
继承在一定程度上让程序在编写的过程中更加方便,但是有时候也会给我们的程序带来一定的困扰,所以认真的学习继承的原理,以及处理的方法很重要.下面是Css中处理继承的一个方法.在一段CSS代码中见到一个大于 ...
- CSS样式中” 大于号”
CSS样式中” 大于号” 在一段CSS代码中见到一个大于号(>),代码如下: BODY#css-zen-garden > DIV#extraDiv2 { BACKGROUND-IMAGE: ...
- 1:CSS中一些@规则的用法小结 2: @media用法详解
第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下 at-rule ...
- xml文件sql中大于号、小于号、等号的转义问题
1.用小于或小于等于的场景 代码1: <delete id="delOvertimeLog" parameterType="java.lang.Integer&qu ...
- mybatis使用时遇到的一些问题------模糊查询、处理大于号小于号、相关函数替换空值
在mybatis中可能会用到的方法 1.模糊查询 <select id="showByIdName" parameterType="User" resul ...
- html5 css选择器 井号, 句点的区别
一.理解CSS的样式组成CSS里的样式表是有规则组成的,每条规则有三个部分组成:1.选择器(如下面例子中的:"body"),告诉浏览器文档的哪个部分受规则影响:2.属性(如实例中的 ...
- mybatis在XML中大于号转义字符
mybatis在编写sql时不能在XML里直接使用‘<’ 或者是 ‘>’ 在这里需要使用转义字符替换 下面列举常用的xml转义对应: * < < ...
- 关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案
最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果.遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Conte ...
- jquery选择器空格与大于号、加号与波浪号的区别
空格:$('parent childchild')表示获取parent下的所有的childchild节点,所有的子孙. 大于号:$('parent > child')表示获取parent下的所有 ...
随机推荐
- 织梦DEDE分类信息实现联动筛选(支持多条件多级选项)解决方案
发布时间:2017-03-25 来源:未知 浏览:404 关键词: 很多织梦建站的站长在做产品列表页的时候,产品分类多而且都是关联的,用户不能快速的找到自己需要的东西,很多情况下都需要用到筛选功能,织 ...
- 全网最新最简单的 OpenJDK13 代码编译
目录 开始咯 1.下载源码 2.安装编译需要的依赖 3.安装 jdk 12 4.检查配置 5.开始编译 6.验证是否成功 回顾 个人博客原文:全网最新最简单的 OpenJDK13 代码编译 最近因写文 ...
- PHP获取客户端的真实IP
REMOTE_ADDR只能获取访问者本地连接中设置的IP,如中南民族大学校园网中自己设置的10.X.XXX.XXX系列IP,而这个函数获取的是局域网网关出口的IP地址, 如果访问者使用代理服务器,将不 ...
- 01 python安装与初识
一.简要概述 python学习时设计要大于开发. 二.编程语言 1.分类 编程语言分为高级语言和低级语言.高级语言如python.c#,Java.PHP等,低级语言(基础语言)如C.汇编语言. 2.机 ...
- Rust入坑指南:核心概念
如果说前面的坑我们一直在用小铲子挖的话,那么今天的坑就是用挖掘机挖的. 今天要介绍的是Rust的一个核心概念:Ownership.全文将分为什么是Ownership以及Ownership的传递类型两部 ...
- 52个有效方法(1) - 了解Objective-C语言的起源
Objective-C语言使用的是"消息结构"而非"函数调用" "消息结构"和"函数调用"之间的区别 "消息结 ...
- 网页布局——Box盒子
在移动端开发的时候,圣杯布局,弹性盒,是我们经常会用得到的,W3C很久以前就有一个display:box属性 flex是最新的,但是在实际的浏览器测试中,display: flex 不能完全替代dis ...
- python程序调用C/C++代码
这篇用来记录在些模拟Canoe生成CAN数据桢工具时遇到的问题, 生成CAN数据桢,主要分为两个关注点: 1.如何从can信号名获取到can信号的ID长度以及信号的起始位,并将信号值按照一定的规则填写 ...
- [BZOJ29957] 楼房重建 - 线段树
2957: 楼房重建 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 3294 Solved: 1554[Submit][Status][Discus ...
- Java自动化测试框架-04 - TestNG之Test Method篇 - 道法自然,法力无边(详细教程)
简介 按照上一篇的计划,这一篇给小伙伴们分享一下测试方法. 一.设置参数 测试方法是可以带有参数的.每个测试方法都可以带有任意数量的参数,并且可以通过使用TestNG的@Parameters向方法传递 ...