语法基础

CSS的基本目标是让浏览器以指定的特性去绘制页面元素,这些是由属性和属性值的定义来实现的。

 

在CSS中,一个属性与值的键值对被称为CSS声明,多个CSS声明组成CSS声明块,CSS声明块则关联选择器则形成CSS规则,CSS规则的集合则最后构成整个样式表。

属性和值

属性(property)是一个标识符,表示某个CSS特性,比如:颜色,字体,大小等。

值(value)则描述了浏览器引擎如何处理该特性。每个属性都包含一个有效值的集合,它有正式的语法和语义定义,被浏览器引擎实现。

样式表基本上就是由一系列的这些属性和值构成的键值对所组成。

声明

声明(declaration)是一个属性与值的键值对,属性与值之间以:(冒号)分隔。

  border: 1px solid hsla(0,0%,0%,.5);

声明块

声明块(declaration block)包含一条或多条声明,声明块里的各个声明之间用分号分离。 声明块被包含在一对大括号{和}里面,声明块可以嵌套。

{
  border: 1px solid hsla(0,0%,0%,.5);
  border-radius: 2px;
  width:235px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  margin:36px auto;
}

规则

规则(Rule)由两个主要的部分构成:选择器(Selector),声明块。选择器用来选择页面多个元素的条件,声明块定义对符合条件的页面元素如何设置属性。

.search-bar {
  border: 1px solid hsla(0,0%,0%,.5);
  border-radius: 2px;
  width:235px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  margin:36px auto;
}

at规则

规则是CSS语句的一种类型,其作用是将一组CSS声明与用选择器定义的条件相关联。除规则之外,CSS中还有其他比如定义字符集,导入其它的外部样式表,字体等比较特殊的命令,这些是通过at规则语句来实现的。 at规则(at-rules)。以@开始,随后是标识符,一直到以分号或右大括号结束。每个at规则由其标识符定义,可能有它自己的语法。 at规则涵盖了meta信息(比如 @charset @import),条件信息(比如@media @document), 描述信息(比如@font-face)。

语句

上面的规则和at规则在CSS中被统称为CSS语句。 语句以非空格的字符开头,以第一个反花括号或分号结束。

注释代码

CSS里可以写注释代码,CSS注释的开始使用/*,结束使用*/。

/*下面是检索条的样式定义*/
.search-bar {
}