1. 选择器的分组
—————————————————————————
 
可以对选择器进行分组,被分组的选择器享用共同的声明。
 
h1,h2,h3,h4,h5,h6 {
color: green;
}
 
上面代码里,标题元素享用了同一个声明,所有的标题元素都是绿色的。
 
 
2. 继承
—————————————————————————
 
CSS 中,子元素会从父元素继承属性。
 
body {
font-family: Verdana, sans-serif;
}
 
根据上面的规则,页面的 body 元素将使用 Verdana 字体(假如访问者的系统里存在这个字体的话)。
 
通过 CSS 的继承,子元素(可能是 h1、p、td、li 等)将继承最高元素(这里是 body)所拥有的属性,显示 Verdana 字体,子元素的子元素也一样。
 
 
3. 摆脱继承的诅咒
—————————————————————————
 
如果你不希望“Verdana, sans-serif”字体被所有的子元素继承,你可以针对特定的标签元素进行设定,比如下面的 p 元素。
 
body  {
font-family: Verdana, sans-serif;
} p {
font-family: Times, "Times New Roman", serif;
}
 
P 元素有自己的字体显示规则。
 
 
4. 参考链接
—————————————————————————
 
 
 
(完)

CSS 高级语法 ---- 继承和选择器的分组的更多相关文章

  1. CSS 高级语法

    选择器的分组 你可以对选择器进行分组,这样,被分组的选择器就可以分享相同的声明.用逗号将需要分组的选择器分开.在下面的例子中,我们对所有的标题元素进行了分组.所有的标题元素都是绿色的. h1,h2,h ...

  2. (三)CSS高级语法

    选择器分组 可以对选择器进行分组,被分组的选择器可以分享相同的声明,用逗号将需要分组的选择器分开.例如: h1,h2,h3,h4,h5,h6 { color: green; } 继承以及其问题一般,子 ...

  3. JS高级语法与JS选择器

    元素(element)和节点(node) childNode属性和children属性的区别 <!DOCTYPE html> <html lang="en"> ...

  4. css基础语法一(选择器与css导入方式)

    页面中,所有的CSS代码,需要写入到<style></style>标签中.style标签的type属性应该选择text/css,但是type属性可以省略. CSS修改页面中的所 ...

  5. CSS导入方式和六种选择器

    1.css的导入方式 1.1 行内嵌式 1.2 内部方式 1.2.1含义: css代码写在<head>的<style>标签中 1.2.2 优点 方便在同页面中修改样式 1.2. ...

  6. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

  7. day40 css高级选择器

    一.高级选择器 高级选择器分为:后代选择器.子代选择器.并集选择器.交集选择器 后代选择器 使用空格表示后代选择器.顾名思义,父元素的后代(包括儿子,孙子,重孙子) .container p{ col ...

  8. 前端基础--css基本语法,选择器

    一.css概述 CSS(Cascading Style Sheet)层叠样式表,定义如何显示HTML元素,给HTML设置样式,让它更加美观.当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式 ...

  9. 1 CSS简介&语法&选择器及优先级&背景&文本&字体&链接&列表&表格

    什么是CSS? Cascading Style Sheets层叠样式表,样式定义如何显示HTML元素 样式通常存储于样式表中,外部样式表通常存储在CSS文件中 多个样式定义可层叠为1,样式对网页中元素 ...

随机推荐

  1. JavaScript 几种简单的table切换

    方法一:for循环+if判断当前点击与自定义数组是否匹配 <!DOCTYPE html> <html lang="en"> <head> < ...

  2. Chrome浏览器插件推荐大全

    如何下载:http://www.cnplugins.com/devtool/ 提示:下载可能版本过旧,推荐搜索喜爱的插件之后前往官网或者github(编译的时候确保node和npm都是最新的版本).或 ...

  3. 使用context来传递数据,一个context是一系列变量

    页面设计工作和python代码分离,所以我们引用模板来实现这个功能. 一.模板实例 下面是一个模板的实例: [python]<html><head><title>O ...

  4. java 正则表达式获取匹配和非获取匹配

    package test1; import java.util.regex.Matcher; import java.util.regex.Pattern; public class TestExp ...

  5. LFS初次成功+如何粘贴复制LFS命令

    搞了几次LFS,终于成功了,总算舒了一口气. 这次搞LFS用到的资料:LFS文档:http://www.ha97.com/book/lfs-book-6.6/index.html  一份简单的指导文章 ...

  6. IOS第18天(3,CALayer隐式动画)

    ******隐式动画(手指拖拽Layer) #import "HMViewController.h" @interface HMViewController () @propert ...

  7. nba技能表

    球员名 主动技能名 主动技能效果 拆解技能名 拆解技能效果 巅峰-纳什 跑投三分 全队三分出手概率提高X%,但体力消耗增加Y% 稳固进攻 全队进攻增加X%,持续整场比赛 巅峰-科比 肉搏 对方全体行动 ...

  8. 使用swfupload上传超过30M文件,使用FLASH上传组件

    原文:使用swfupload上传超过30M文件,使用FLASH上传组件 前一段时间会员的上传组件改用FLASH的swfupload来上传,既能很友好的显示上传进度,又能完全满足大文件的上传. 后来服务 ...

  9. LeetCode Minimum Height Trees

    原题链接在这里:https://leetcode.com/problems/minimum-height-trees/ 题目: For a undirected graph with tree cha ...

  10. magento 备份

    magento 备份分为“文件备份”和“数据备份” 我们先来讲下“数据备份” 数据备份的方法有 通过数据库软件直接导出magento使用的数据库,使用mysql命名或者phpmyadmin,导出来就好 ...