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 中,是为了解决内容与 ...
随机推荐
- visual studio 单元测试的认识
单元测试(unit testing),对软件中的最小单元进行检查和验证,其一般验证对象是一个函数或者一个类. Team Test 是 Visual Studio 集成的单元测试框架,它支持: 测试方法 ...
- Oracle EBS PO rcv_shipment_headers 数据缺失
Datafix : How to Recreate Missing Receipt or Shipment Header Records (RCV_SHIPMENT_HEADERS table) (D ...
- sqlserver sql优化案例及思路
始sql: SELECT TOP 100 PERCENT ZZ.CREW_NAME AS 机组, ZZ.CREW_ID, AA.年度时间, CC.当月时间, DD.连续七天时间 AS 最近七天 FRO ...
- 个人犯的一个golang routine错误
这个其实不是错误,2个写法没有区别.-2015.11.22 认识golang也不少时间了,也做过几个项目.最近发现之前用golang写的一个服务,内存涨得比较快,一直没找出来原因来.今天把疑惑发到群里 ...
- Huawei DHCP 全局配置与接口配置
网络拓扑图如下所示: 说明: 1.交换机Ge0/0/1口和Ge0/0/2口配置基于全局的DHCP: 2.交换机Ge0/0/3口配置基于端口的DHCP: 3.交换机上配置vlan 10 .vlan 20 ...
- seq 序列
seq 序列用法: seq [option]...last seq [option]...first last seq [option]...first increment last 例如:seq 5 ...
- javascript的基础知识整理
Basic ObjectsArray Properties constructor 属性返回对创建此对象的数组函数的引用 object.constructor prototype 属性使您有能力向对 ...
- SecureCRT Win免安装版本,简单好用
SecureCRT是一款支持SSH(SSH1和SSH2)的终端仿真程序,简单地说是Windows下登录UNIX或Linux服务器主机的软件. 这个简单好用,程序员必备. 下载地址:SecureCRT. ...
- myeclipse10配置maven
一:Maven的下载安装 准备工作: 1)安装环境 Windows xp 2)需安装JDK ,并配置环境变量(略) 3) Maven版本3.0.5 4)下载地址:http://mirror.bit.e ...
- vue-cli静态资源处理
vue-cli是利用webpack进行打包部署,其中静态资源的路径问题是一个比较麻烦的部分. 项目中共有两个存放静态文件的地方. /static 根目录下的static文件夹 assets src目录 ...