CSS 包含选择器(九)
一、包含选择器
包含选择器中前后两部分之间以空格隔开,根据左侧选择符指定的祖先元素,然后在该元素下寻找匹配右侧的选择侧符的下级元素
定义包含选择器时,必须保证在HTML结构中第一个对象能够包含第二个对象。
二、简单例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>包含</title>
<style type="text/css">
/*定义类样式*/
.div1{
font-size:14px;
color:#FF0000;
}
/*定义类样式下的标题元素*/
.div1 h1{
color:#FF00FF;
}
/*定义类样式下的span元素*/
.div1 span{
color:#0000FF;
}
</style>
</head> <body>
<div class="div1">
这是类
<h1>这是个标题<span>这是标题中的SPAN元素</span></h1>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>包含</title>
<style type="text/css">
/*定义类样式*/
.div1{
font-size:14px;
color:#FF0000;
}
/*定义类样式下的标题元素*/
.div1 h1{
color:#FF00FF;
}
/*定义类样式下的span元素*/
.div1 span{
color:#0000FF;
}
</style>
</head> <body>
<div class="div1">
这是类
<h1>这是个标题<span>这是标题中的SPAN元素</span></h1>
</div>
</body>
</html>
结果:
CSS 包含选择器(九)的更多相关文章
- CSS的选择器
<div id="demo"> <div class="inner"> <p><a href="#" ...
- [css]我要用css画幅画(九) - Apple Logo
接着之前的[css]我要用css画幅画(八) - Hello Kitty,这次画的是苹果公司的logo 这次打算将分析和实现步骤尽量详细的说一说. 其实之前的也打算详细讲分析和设计过程,不过之前的图比 ...
- CSS 后代选择器
后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...
- CSS样式选择器优先级
CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...
- CSS 类选择器
在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...
- CSS id 选择器
id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...
- CSS类选择器和ID选择器
CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...
- CSS 子选择器(六)
一.子选择器 子选择器中前后部分之间用一个大于号隔开,前后两部分选择符在结构上属于父子关系. 子选择器是根据左侧选择符指定的父元素,然后在该父元素下寻找匹配右侧选择符的子元素. 二.简单例子 < ...
- css之选择器
我们都用过jquery,使用jquery选择器,非常的简单,最近刚好有项目上手,拿起书本看了一下,发现好多的东西都忘掉了,好记性不如烂笔头,就将这章内容记录下来,现在我们看下css原生的选择器. 选择 ...
随机推荐
- 配置EF链接 MySql 的方法
材料: 1.MySQL for Visual Studio 1.2.4.msi 下载:http://dev.mysql.com/downloads/windows/visualstudio/ 2.my ...
- `fw服务端非完整` 工程开发初期的工作
前面写到了一些关于cocos2dx在开发中的一些模块以及一些解决方法,那些都属于本人的个人简介和个人倾向的解决方案.最近这几天我完善了一下ui解析的部分,当然也只是抽出一点点时间去做的这件事情.我添加 ...
- 深入研究 蒋金楠(Artech)老师的 MiniMvc(迷你 MVC),看看 MVC 内部到底是如何运行的
前言 跟我一起顺藤摸瓜剖析 Artech 老师的 MiniMVC 是如何运行的,了解它,我们就大体了解 ASP.NET MVC 是如何运行的了.既然是“顺藤摸瓜”,那我们就按照 ASP.NET 的执行 ...
- Alwayson+Replication
本文将介绍如何实现Alwayson + Replication ,通过AlwaysOn实现Publication database的高可用性,使Publication database在failove ...
- Lua中的协同程序 coroutine
Lua中的协程和多线程很相似,每一个协程有自己的堆栈,自己的局部变量,可以通过yield-resume实现在协程间的切换.不同之处是:Lua协程是非抢占式的多线程,必须手动在不同的协程间切换,且同一时 ...
- maven -- 问题解决(二)解决“Could not calculate build plan”问题
错误提示如下:(eclipse+maven) Could not calculate build plan: Failure to transfer org.apache.maven.plugins: ...
- SharePoint 2013中规划企业搜索体系结构
摘要:了解如何规划小型.中型或大型企业搜索体系结构. 设置企业搜索体系结构之前,需要仔细规划很多事项.我们将逐步帮助您规划小型.中型或大型企业搜索体系结构. 您是否熟悉 SharePoint 2013 ...
- SQL中的连接查询及其优化原则
连接查询是SQL的主要任务,只有很好的掌握了连接查询及其优化方法才算是掌握了SQL的精髓所在.最近在面试中遇到了有关连接查询的问题,感觉回答的不是很好,总结一下. 具体示例请参考:http://www ...
- CentOS6.5菜鸟之旅:纯转载Linux目录结构
来自:http://www.iteye.com/topic/1125162 使用linux也有一年多时间了 最近也是一直在维护网站系统主机 下面是linux目录结构说明 本人使用的是centos系 ...
- 在VS中使用TinyFox调试OWIN应用(转)
在很早一段时间之前,我曾经写过一篇关于Katana的使用方法的文章<如何安装并简单的使用OwinHost——Katana>,上面就有介绍如何在VS中调试使用Katana作为Host的App ...