一、包含选择器

包含选择器中前后两部分之间以空格隔开，根据左侧选择符指定的祖先元素，然后在该元素下寻找匹配右侧的选择侧符的下级元素

定义包含选择器时，必须保证在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 包含选择器(九)的更多相关文章

  1. CSS的选择器

    <div id="demo"> <div class="inner"> <p><a href="#" ...

  2. [css]我要用css画幅画(九) - Apple Logo

    接着之前的[css]我要用css画幅画(八) - Hello Kitty,这次画的是苹果公司的logo 这次打算将分析和实现步骤尽量详细的说一说. 其实之前的也打算详细讲分析和设计过程,不过之前的图比 ...

  3. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

  4. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  5. CSS 类选择器

    在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...

  6. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

  7. CSS类选择器和ID选择器

    CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...

  8. CSS 子选择器(六)

    一.子选择器 子选择器中前后部分之间用一个大于号隔开,前后两部分选择符在结构上属于父子关系. 子选择器是根据左侧选择符指定的父元素,然后在该父元素下寻找匹配右侧选择符的子元素. 二.简单例子 < ...

  9. css之选择器

    我们都用过jquery,使用jquery选择器,非常的简单,最近刚好有项目上手,拿起书本看了一下,发现好多的东西都忘掉了,好记性不如烂笔头,就将这章内容记录下来,现在我们看下css原生的选择器. 选择 ...

随机推荐

  1. Hadoop入门进阶课程6--MapReduce应用案例

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博主为石山园,博客地址为 http://www.cnblogs.com/shishanyuan  ...

  2. HMM 自学教程（五）前向算法

    本系列文章摘自 52nlp(我爱自然语言处理: http://www.52nlp.cn/),原文链接在 HMM 学习最佳范例,这是针对 国外网站上一个 HMM 教程 的翻译,作者功底很深,翻译得很精彩 ...

  3. Network - 工具列表

    Tcpdump homepage - tcpdump wiki - tcpdump Wireshark homepage - wireshark wiki - wireshark Fiddler ho ...

  4. 新开博客 http://wylhyz.github.io/

    刚刚使用hexo在github pages上建立了静态博客,地址 http://wylhyz.github.io/

  5. Android 常见工具类封装

    1,MD5工具类: public class MD5Util { public final static String MD5(String s) { char hexDigits[] = { '0' ...

  6. Django--上传文件

    需求 Django中forms表单上传文件处理​ 速查 views.py 1 2 3 4 5 6 7 8 9 def upload(request):     if request.method==' ...

  7. 说说jsonp

    什么是jsonp jsonp充其量只能说是一种"方法".它可以让页面从其他域中获取资料.   首先要知道的是同源策略,在javascript中使用http请求(ajax)是会受到同 ...

  8. C#动态属性（.NET Framework4.5支持）

    获取方法: /* 使用方法: 1. 在web.config 的<configSections> 节点中添加 <section name="customConfigs&quo ...

  9. SQL 分类统计函数

    SELECT TransactionNumber,SUM(CASE WHEN ReasonLevel=0 THEN           TransactionNumber ELSE 0 end ) a ...

  10. JavaScrip的DOM操作

    1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型,文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西 2.Windows对象操作 一.属性和方法 二.Window.open(& ...