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. 在VS中为C/C++源代码文件生成对应的汇编代码文件(.asm)

    以VS2017为例 然后重新生成工程,在工程目录中就会有对应的汇编代码文件.

  2. C - The kth great number 优先队列

    Xiao Ming and Xiao Bao are playing a simple Numbers game. In a round Xiao Ming can choose to write d ...

  3. 4.express 框架

    express express 官网:http://expressjs.com/ 中文:http://www.expressjs.com.cn/ 库:jquery 一堆 的属性和方法 框架:expre ...

  4. 2 虚拟机Oracle11.2.0.4服务器端,第三方图形化界面安装步骤

    环境: 虚拟机:winserver 2012r2  数据中心版   64位 物理主机:win7 旗舰版 64位 网络环境:网线连接内网,WiFi外网 一.虚拟机相关设置 包括计算机名,与物理主机的网络 ...

  5. image的srcset属性

    介绍 响应式页面中经常用到根据屏幕密度设置不同的图片.这个时候肯定会用到image标签的srcset属性.srcset属性用于设置不同屏幕密度下,image自动加载不同的图片.用法如下: <im ...

  6. php 删除空格 和 回车

    //删除空格 和 回车 function trimall($str){ $oldchar=array(""," ","\t","\ ...

  7. java框架之SpringBoot(1)-入门

    简介 Spring Boot 用来简化 Spring 应用开发,约定大于配置,去繁从简,just run 就能创建一个独立的.产品级别的应用. 背景: J2EE 笨重的开发.繁多的配置.低下的开发效率 ...

  8. form提交循环

    使用ajax提交数据时,如果数据非常多,提交会比较麻烦,这时可以给form表一个id=“form”,用serializeArray()方法进行提交. erializeArray()方法通过序列化表单值 ...

  9. MySql 创建索引原则

    https://blog.csdn.net/csdnones/article/details/50412603 为了使索引的使用效率更高,在创建索引时,必须考虑在哪些字段上创建索引和创建什么类型的索引 ...

  10. js实现多行文本溢出省略

    实现效果: css: position: relative; line-height: 20px; max-height: 60px; js: function overflowHiddon(el) ...