CSS快速入门-组合选择器
<div class="gradefather"> hello1
<div class="father">hello2
<p class="son">hello4</p>
</div>
<p>hello3</p>
<p>hello5</p>
</div>
一、A,B :任意选择器 A or B
div,p { #所有div或者p标签
font-size:10px;
color:blue;
}
二、A B:后代选择器,A 标签下的所有B
div p { #div下所有p标签
font-size:20px;
color:green;
}
三、A>B:子选择器,仅仅儿子级别会选中.
gradefather>p {#gradefather的子标签,仅hello3 hello5 会作用
font-size:20px;
color:red;
}
.father>p {#father的子标签,仅hello4 会作用
font-size:20px;
color:red;
}
四、A+B:毗邻选择器,仅仅相邻的同级别(兄弟sibling)第一个会选中.
father+p { #father的第一个邻居,仅仅hello3会作用
font-size:20px;
color:green;
}
注意:
1、块级元素可以包含内联元素或某些块级元素,但内联元素不能包含块级元素,它只能包含其它内联元素。块级标签默认占一行,内联标签占内容大小的空间。
2、有几个特殊的块级元素只能包含内联元素,不能包含块级元素。如h1,h2,h3,h4,h5,h6,p,dt
3、li内可以包含div
4、块级元素与块级元素并列、内联元素与内联元素并列。
CSS快速入门-组合选择器的更多相关文章
- CSS快速入门-基本选择器
1.标签选择器 通过标签进行元素选择. <style> a { font-size:10px; color:red; } </style> 2.* *代表通配符,匹配任意标签, ...
- CSS快速入门(四)
目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 ...
- Html与CSS快速入门02-HTML基础应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 示例 ...
- Html与CSS快速入门03-CSS基础应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 边框 ...
- Html与CSS快速入门04-进阶应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 之前 ...
- HTML/CSS快速入门
Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...
- Html与CSS快速入门01-基础概念
Web前端技术一直是自己的薄弱环节,经常为了调节一个简单的样式花费大量的时间.最近趁着在做前端部分的开发,果断把这部分知识成体系的恶补一下.内容相对都比较简单,很类似工具手册的学习,但目标是熟练掌握. ...
- 02-03 CSS快速入门
css四种引入方式:test.html: p{ color: gold; font-size: 20px; } title.html: <!DOCTYPE html> <html l ...
- web前端之css快速入门
css简介 css概述 CSS 指层叠样式表 (Cascading Style Sheets)样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中,是为了解决内容与 ...
随机推荐
- Win10命令行激活 & 电脑组装
系统激活: 1. 管理员身份运行 cmd 2. slmgr.vbs /upk ...
- zabbix agent 3.4 安装指南
从官方网站www.zabbix.com 下载zabbix agent安装包.目前最新版本是4.0 LTS release. 在需要监控的服务器上安装zabbix agent. 先解压安装包. 配置 c ...
- js-dom-动态创建html标签时,name属性的初始化问题
当我们动态创建可包含Name属性的元素时,不能简单的使用赋值element.name = "..."来添加其Name, 而必须在创建Element时,使用document.crea ...
- 华为MSTP负载均衡配置示例
以下内容摘自由华为公司授权并审核通过,今年元月刚刚出版上市的<华为交换机学习指南>一书:http://item.jd.com/11355972.html,http://product.da ...
- Redis缓存雪崩、缓存穿透、热点Key解决方案和分析
缓存穿透 缓存系统,按照KEY去查询VALUE,当KEY对应的VALUE一定不存在的时候并对KEY并发请求量很大的时候,就会对后端造成很大的压力. (查询一个必然不存在的数据.比如文章表,查询一个不存 ...
- mysql数据导入导出与数据表优化
一.数据导入 mysqlimport -uroot oa d:/aa.txt --fields-terminated-by=, --fields-optionally-enclosed-by= --l ...
- SQL语句:查看排名前五的SQL语句耗时情况
total_worker_time , last_worker_time , max_worker_time , min_worker_time , ) , ( ( CASE statement_en ...
- [技术] OIer的C++标准库 : 字符串库
引入 上次我在博客里介绍了OI中可能用到的STL中的功能, 今天我们接着来发掘C++标准库中能为OI所用的部分. 点击传送至我的上一篇系列博文 众所周知, OI中经常用到字符串相关的处理, 这时善用字 ...
- The Rock Game
Before the cows head home for rest and recreation, Farmer John wantsthem to get some intellectual st ...
- Stay true to yourself
https://zhuanlan.zhihu.com/p/22928614 艾伦·德詹尼斯,1958年1月26日出生于美国路易斯安纳州梅泰里,美国主持人.演员.凭借出众的诙谐幽默的口才和喜剧天赋,活跃 ...