第1章 层叠、优先级和继承

本章概要

❑ 组成层叠的四个部分

❑ 层叠和继承的区别

❑ 如何控制样式和元素的对应关系

❑ 简写声明的常见误区

在软件开发中,CSS是很特别的存在。严格来讲,它不是编程语言,却要求抽象思维。它不是纯粹的设计工具,却要求创造力。它提供了看似简单的声明式语法,但是在大型项目中写过CSS的人都知道它可能会变得极其复杂。

在学习传统编程中遇到问题时,你通常知道该搜索什么(比如,“如何找到一个数组里类型为x的元素”)。在CSS中,却很难将问题提炼成一句话。即使可以,答案一般也是“这得看情况”。最好的解决办法通常取决于具体场景,以及你希望以多大粒度处理各种边缘情况。

尽管了解一些“小技巧”或者具体的实现方式很有用,真正掌握CSS却需要理解这些实践背后的原理。本书虽然包含了很多例子,但其核心是CSS的原理。

本书第一部分首先介绍CSS最基本的原理:层叠、盒模型、可用的各种单位类型。大多数Web开发人员知道层叠和盒模型。他们了解像素单位,可能还听说过“应该改用em单位”。然而这类话题太多了,对此一知半解不能让你走得更远。如果要掌握CSS,你一定要理解基础知识,并且是深入地理解。

你现在一定迫不及待地想要学习最新、最酷的CSS特性。那些特性确实令人兴奋,但首先你需要复习一下基础知识。我会快速地概括你可能熟知的所有基础知识,然后深入介绍每个话题。本章的目的是强化基础,CSS的其他部分是在这些基础上构建的。

本章将首先介绍CSS里的C(代表cascade,层叠)。我将先讲解它的原理,然后展示一些例子。接着将介绍与层叠相关的话题:继承。之后将介绍简写属性以及对它们的常见误解。

总而言之,本章的话题都是关于将特定样式应用到目标元素的,其中有很多开发人员踩过的“坑”。理解这些话题能够让你更好地掌握CSS。运气好的话,你还会更加欣赏和享受开发CSS的乐趣。