一、子选择器

子选择器中前后部分之间用一个大于号隔开,前后两部分选择符在结构上属于父子关系。

子选择器是根据左侧选择符指定的父元素,然后在该父元素下寻找匹配右侧选择符的子元素。

二、简单例子

<!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>
<link type="text/css" rel="stylesheet" href="css/demo5.css"/>
</head> <body>
<div>
<p>这是个段落
<a href="#">这是超连接</a>
</p>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
/*设置div下的p元素的样式*/
div>p{
font-size:14px;
color:#0000FF;
}
/*设置p元素下的a元素的样式*/
p>a{
font-size:16px;
color:#FF0000;
text-decoration:none;
}
/*错误的写法 div 与a不是父子关系时,是取不到的*/
div>a{
font-size:20px;
color:#FF0000;
text-decoration:none;
}

子选择器很少用到,一般使用包含选择可以不受父子关系影响的选择

以下写法包含选择器

div a{
font-size:20px;
color:#FFFF00;
text-decoration:none;
}

CSS 子选择器(六)的更多相关文章

  1. CSS子选择器与后代选择器的区别

    p > span{ color:blue; } <p> 嵌套使用<span>css好牛逼!</span><span>是啊<b>也影响孙 ...

  2. css子选择器 :frist-child :nth-child(n) :nth-of-type(n) ::select选择器

    记录一下前一段时间使用.学习的几种选择器. 1. :frist-child 选择器n 比如<ul><li></li> <li></li> & ...

  3. 新的 css 子选择器

    1. html 结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  4. CSS 子元素选择器与后代选择器区别实例讲解

    css子元素选择器和后代选择器在功能描述上非常相同,但是他们其实是有区别的,本文章通过两个简单的实例向大家介绍子元素选择器与后代选择器的区别,需要的朋友可以参考一下. 首先我们来了解一下子元素选择器与 ...

  5. CSS系列(8) CSS后代选择器和子选择器详解

    一.CSS后代选择器详解 1,  生动介绍基本概念 一个标签嵌B在另一个标签A内部,B就是A的后代. 而且,B的后代也是A的后代,这就叫“子子孙孙无穷尽也”. 比如: <div> < ...

  6. CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解

    派生选择器用的很多,派生选择器具体包括为后代选择器.子元素选择器.相邻兄弟选择器,我们来理解一下他们之间的具体用法与区别. 1.css后代选择器语法:h1 em {color:red;} 表示的是从h ...

  7. 前端学习笔记之CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解

    派生选择器用的很多,派生选择器具体包括为后代选择器.子元素选择器.相邻兄弟选择器,我们来理解一下他们之间的具体用法与区别. 1.css后代选择器语法:h1 em {color:red;} 表示的是从h ...

  8. CSS系列之后代选择器、子选择器和相邻兄弟选择器

    后代选择器比子选择器的范围大,包含子选择器,且包含子选择器的“子孙”选择器,后代选择器使用"空格"符号间隔选择器 子选择器:子选择器只是父选择器的一级子元素,使用"> ...

  9. CSS后代选择器,子选择器和相邻兄弟选择器

    平时在代码练习中,经常用到后代选择器,子选择器也会用到,这里做个总结: 1,后代选择器和子选择器区别: ①写法不一样:后代选择器的标识为:空格 如:ul li{width:150px;} [ul和li ...

随机推荐

  1. AssetBundle系列——游戏资源打包(二)

    本篇接着上一篇.上篇中说到的4步的代码分别如下所示: (1)将资源打包成assetbundle,并放到自定目录下 using UnityEditor; using UnityEngine; using ...

  2. No Dialect mapping for JDBC type: -9

    由于项目中使用的是hibernate 4.35版本和sqlserver 2008数据库.所以,自定义方言时,需要和老版本做区别: public class MySQLServerDialect ext ...

  3. spring源码分析之spring-web remoting模块概况及基本概念

    spring-web总体分为三部分:caucho.httpinvoker.jaxws,其总体构造图如下: uml结构: 先看看网上搜索到的上述实现的原理吧:Spring RMI,Hessian/Bur ...

  4. 【转载】Ubuntu下SVN安装和配置

    一.SVN安装 1.安装包 1.$ sudo apt-get install subversion 2.创建项目目录 $ sudo mkdir /home/xiaozhe/svn $ cd /home ...

  5. 利用 word2vec 训练的字向量进行中文分词

    最近针对之前发表的一篇博文<Deep Learning 在中文分词和词性标注任务中的应用>中的算法做了一个实现,感觉效果还不错.本文主要是将我在程序实现过程中的一些数学细节整理出来,借此优 ...

  6. Android开发切换host应用

    由于在工作过程中常需要切换手机的host来测试不同服务器上的接口,所以想到需要这么个软件. SwitchHost在PC上是一款很好用的修改Host的软件,手机上也需要这么一款App(当然手机需要已经R ...

  7. SQL Server技术问题之索引优缺点

    索引是对数据库表中一列或多列的值进行排序的一种结构,使用索引可快速访问数据库表中的特定信息. 优点: 正确的索引会大大提高数据查询.对结果排序.分组的操作效率. 缺点: 1.存储空间,每个索引都要空间 ...

  8. 一起Polyfill系列:让Date识别ISO 8601日期时间格式

    一.什么是ISO 8601日期时间格式 ISO 8601是国际标准化组织制定的日期时间表示规范,全称是<数据存储和交换形式·信息交换·日期和时间的表示方法>. 示例: 1. 2014-12 ...

  9. PowerDesigner的安装和数据库创建(转载)

    此文描述详细,特此转载,仅复制了大部分内容,可参考原文CodeSmith和PowerDesigner的安装和数据库创建(原创) 请大家不要用于商业用途哈,要支持正版,大家都是做软件的,知道开发一套软件 ...

  10. 【循序渐进学Python】2. Python中的序列——列表和元组

    序列概览 在Python中有六种内建的序列:列表.元组.字符串.Unicode字符串.buffer对象和xrange对象.在这里暂时只讨论列表和元组.列表和元组的主要区别在于:列表可以修改,元组(不可 ...