diff --git a/files/zh-cn/web/css/quotes/index.html b/files/zh-cn/web/css/quotes/index.html index 44ba326a71bed3..12c614ac85d1a3 100644 --- a/files/zh-cn/web/css/quotes/index.html +++ b/files/zh-cn/web/css/quotes/index.html @@ -32,7 +32,7 @@

值

none
-
 {{cssxref("content")}} 属性的值 open-quote 和 close-quote 将不会展示引号.
+
 {{cssxref("content")}} 属性的值 open-quote 和 close-quote 将不会展示引号。
auto
用适当的引号，基于在所选元素上设置的任何语言值（例如，通过 {{htmlattrxref("lang")}} 属性）。
[<string> <string>]+
@@ -101,8 +101,8 @@

结果

备注

规范

diff --git a/files/zh-cn/web/css/ratio/index.html b/files/zh-cn/web/css/ratio/index.html index 534490daec1648..1c9934ea4f19e7 100644 --- a/files/zh-cn/web/css/ratio/index.html +++ b/files/zh-cn/web/css/ratio/index.html @@ -5,13 +5,13 @@ ---
{{CSSRef}}
-

       <ratio> CSS数据类型，用于描述媒体查询中的宽高比，表示两个无单位值之间的比例。

+

       <ratio> CSS 数据类型，用于描述媒体查询中的宽高比，表示两个无单位值之间的比例。

句法

-

       在Media Queries Level 3中，<ratio>数据类型包括一个正数的<integer>值，后跟一个正斜杠（'/'，Unicode U + 002F SOLIDUS）和第二个正数的<integer>值。斜杠前后的空格是可选的。第一个数字代表宽度，第二个数字代表高度。

+

       在 Media Queries Level 3 中，<ratio>数据类型包括一个正数的<integer>值，后跟一个正斜杠（'/'，Unicode U + 002F SOLIDUS）和第二个正数的<integer>值。斜杠前后的空格是可选的。第一个数字代表宽度，第二个数字代表高度。

-

       在Media Queries Level 4中，<ratio>数据类型包括一个正数的<number>值，后跟一个正斜杠（'/'，Unicode U + 002F SOLIDUS）和第二个正数的<number>值。此外，允许使用单个<number>作为值。

+

       在 Media Queries Level 4 中，<ratio>数据类型包括一个正数的<number>值，后跟一个正斜杠（'/'，Unicode U + 002F SOLIDUS）和第二个正数的<number>值。此外，允许使用单个<number>作为值。

例子

@@ -35,7 +35,7 @@

常见的宽高比

Ratio4_3.png 4/3 - 在20传统电视制式格式。 + 在 20 传统电视制式格式。 Ratio16_9.png @@ -46,7 +46,7 @@

常见的宽高比

Ratio1_1.85.png 185/100= 91/50
(不允许非整数除数和除数) - 自20世纪60年代以来最常见的电影格式。 + 自 20 世纪 60 年代以来最常见的电影格式。 Ratio1_2.39.png diff --git a/files/zh-cn/web/css/reference/index.html b/files/zh-cn/web/css/reference/index.html index 5c68e8d8a44a2f..5eb2ec9c73d3d2 100644 --- a/files/zh-cn/web/css/reference/index.html +++ b/files/zh-cn/web/css/reference/index.html @@ -46,16 +46,16 @@

样式规则示例

} -

有关 CSS 选择器语法的初学者介绍，请参阅此教程。注意，规则定义中的任何 CSS 语法错误都将使整个规则无效。无效的规则将被浏览器忽略。注意CSS定义完全是基于文本(ASCII)的 , 而 DOM-CSS / CSSOM (规则管理系统) 是基于对象的。

+

有关 CSS 选择器语法的初学者介绍，请参阅此教程。注意，规则定义中的任何 CSS 语法错误都将使整个规则无效。无效的规则将被浏览器忽略。注意 CSS 定义完全是基于文本(ASCII) 的 , 而 DOM-CSS / CSSOM (规则管理系统) 是基于对象的。

@规则语法

-

由于@规则间的结构变化很大，请参阅@规则以找到你所想要的特定规则语法。

+

由于 @规则间的结构变化很大，请参阅@规则以找到你所想要的特定规则语法。

关键字索引

-

注意：此索引中的属性名称不包括与CSS标准名称不同的 JavaScript 名称。

+

注意：此索引中的属性名称不包括与 CSS 标准名称不同的 JavaScript 名称。

{{CSS_Ref}}
@@ -81,7 +81,7 @@

分组选择器

组合选择器

-

组合选择器是在两个或多个简单选择器之间建立关系的选择器，例如“ A是B的子代”或“ A与B相邻”。

+

组合选择器是在两个或多个简单选择器之间建立关系的选择器，例如“A 是 B 的子代”或“A 与 B 相邻”。

diff --git a/files/zh-cn/web/css/shorthand_properties/index.html b/files/zh-cn/web/css/shorthand_properties/index.html index f29a699b715aff..03fd2c4cd55e58 100644 --- a/files/zh-cn/web/css/shorthand_properties/index.html +++ b/files/zh-cn/web/css/shorthand_properties/index.html @@ -11,7 +11,7 @@

简写属性是可以让你同时设置好几个 CSS 属性值的 CSS 属性。使用简写属性，Web 开发人员可以编写更简洁、更具可读性的样式表，节省时间和精力。

-

CSS 规范定义简写属性的目的在于将那些关于同一主题的常见属性的定义集中在一起。比如 CSS 的 {{cssxref("background")}} 属性就是一个简写属性，它可以定义 {{cssxref("background-color")}}、{{cssxref("background-image")}}、{{cssxref("background-repeat")}} 和 {{cssxref("background-position")}} 的值。类似地，最常见的字体相关的属性可以使用 {{cssxref("font")}} 的简写，盒子（box）各方向的外边距（margin） 可以使用 {{cssxref("margin")}} 这个简写。

+

CSS 规范定义简写属性的目的在于将那些关于同一主题的常见属性的定义集中在一起。比如 CSS 的 {{cssxref("background")}} 属性就是一个简写属性，它可以定义 {{cssxref("background-color")}}、{{cssxref("background-image")}}、{{cssxref("background-repeat")}} 和 {{cssxref("background-position")}} 的值。类似地，最常见的字体相关的属性可以使用 {{cssxref("font")}} 的简写，盒子（box）各方向的外边距（margin）可以使用 {{cssxref("margin")}} 这个简写。

棘手的边界情况

@@ -23,52 +23,52 @@

棘手的边界情况

background: url(images/bg.gif) no-repeat top right; 以上样式不会将 background 的 color 值设置为 red，而是 {{cssxref("background-color")}} 的默认值 transparent，因为第二条规则优先。 -
  • 关键词 inherit 只可以应用于单独属性（individual properties），如果应用于一个简写属性（shorthand property），则必须整体应用，而能对简写属性值的每一个部分单独应用。由于单独属性的漏掉的值会被它们的初始值（initial value）替代，因此不可能允许单个属性通过省略继承的 。这意味着让一个属性的值使用继承值的唯一方法就是使用值是 inherit 的普通属性（longhand property）。
    • +
  • 关键词 inherit 只可以应用于单独属性（individual properties），如果应用于一个简写属性（shorthand property），则必须整体应用，而能对简写属性值的每一个部分单独应用。由于单独属性的漏掉的值会被它们的初始值（initial value）替代，因此不可能允许单个属性通过省略继承的。这意味着让一个属性的值使用继承值的唯一方法就是使用值是 inherit 的普通属性（longhand property）。
  • 简写属性不试图强制它们替代属性的值的特定顺序。这适用于当这些属性使用不同类型的值时，因为这个时候顺序并不重要。但当几个属性可以设置相同值的时候，就没那么简单了。处理这些情况分以下几种类型：
      -
    1. 处理和盒子（box）边界（edge）相关的属性时，比如 {{cssxref("border-style")}}、{{cssxref("margin")}} 或者 {{cssxref("padding")}}， 始终使用一致的1个到4个值的语法表示这些边界： +
    2. 处理和盒子（box）边界（edge）相关的属性时，比如 {{cssxref("border-style")}}、{{cssxref("margin")}} 或者 {{cssxref("padding")}}， 始终使用一致的 1 个到 4 个值的语法表示这些边界： - + - + - +
      border1.png1个值的语法：border-width: 1em — 这一个值表示所有的边框宽度1 个值的语法：border-width: 1em — 这一个值表示所有的边框宽度
      border2.png2个值的语法：border-width: 1em 2em — 第一个值表示垂直方向的，即 top 和 bottom；第二个值表示水平方向的，即 left 和 right2 个值的语法：border-width: 1em 2em — 第一个值表示垂直方向的，即 top 和 bottom；第二个值表示水平方向的，即 left 和 right
      border3.png3个值的语法：border-width: 1em 2em 3em — 第一个值表示 top；第二个值表示水平方向的，即 left 和 right； 第三个值表示 bottom3 个值的语法：border-width: 1em 2em 3em — 第一个值表示 top；第二个值表示水平方向的，即 left 和 right；第三个值表示 bottom
      border4.png -

      4个值的语法：border-width: 1em 2em 3em 4em — 这四个值分别表示 top、right、bottom、left，总是按此顺序，即从 top 开始的顺时针顺序（Top-Right-Bottom-Left 首字母与英文单词 trouble 的顺序一致：TRBL）

      +

      4 个值的语法：border-width: 1em 2em 3em 4em — 这四个值分别表示 top、right、bottom、left，总是按此顺序，即从 top 开始的顺时针顺序（Top-Right-Bottom-Left 首字母与英文单词 trouble 的顺序一致：TRBL）
      3. -
    3. 同样，在处理和盒子的角相关的属性时，比如 {{cssxref("border-radius")}}，也始终使用一致的 1个到4个值的语法表示： +
    4. 同样，在处理和盒子的角相关的属性时，比如 {{cssxref("border-radius")}}，也始终使用一致的 1 个到 4 个值的语法表示： - + - + - + diff --git a/files/zh-cn/web/css/specificity/index.html b/files/zh-cn/web/css/specificity/index.html index 44409a9168d02d..76e3e97ac712be 100644 --- a/files/zh-cn/web/css/specificity/index.html +++ b/files/zh-cn/web/css/specificity/index.html @@ -24,7 +24,7 @@

      优先级是如何计算的？

      当同一个元素有多个声明的时候，优先级才会有意义。因为每一个直接作用于元素的 CSS 规则总是会接管/覆盖（take over）该元素从祖先元素继承而来的规则。

      -
      注意: 文档树中元素的接近度（Proximity of elements）对优先级没有影响。
      +
      注意：文档树中元素的接近度（Proximity of elements）对优先级没有影响。

      选择器类型

      @@ -40,11 +40,11 @@

      选择器类型

      您可以访问 "Specificity" in "Cascade and inheritance"  或者 https://specifishity.com 来了解更多关于优先级的详细信息。

      -

      给元素添加的内联样式 (例如，style="font-weight:bold") 总会覆盖外部样式表的任何样式 ，因此可看作是具有最高的优先级。

      +

      给元素添加的内联样式 (例如，style="font-weight:bold") 总会覆盖外部样式表的任何样式，因此可看作是具有最高的优先级。

      !important 例外规则

      -

      当在一个样式声明中使用一个 !important 规则时，此声明将覆盖任何其他声明。虽然，从技术上讲，!important 与优先级无关，但它与最终的结果直接相关。使用 !important 是一个坏习惯，应该尽量避免，因为这破坏了样式表中的固有的级联规则 使得调试找bug变得更加困难了。当两条相互冲突的带有 !important 规则的声明被应用到相同的元素上时，拥有更大优先级的声明将会被采用。

      +

      当在一个样式声明中使用一个 !important 规则时，此声明将覆盖任何其他声明。虽然，从技术上讲，!important 与优先级无关，但它与最终的结果直接相关。使用 !important 是一个坏习惯，应该尽量避免，因为这破坏了样式表中的固有的级联规则 使得调试找 bug 变得更加困难了。当两条相互冲突的带有 !important 规则的声明被应用到相同的元素上时，拥有更大优先级的声明将会被采用。

      一些经验法则：

      @@ -86,7 +86,7 @@
      A) 覆盖内联样式

      你的网站上有一个设定了全站样式的 CSS 文件，同时你（或是你同事）写了一些很差的内联样式。

      -

      全局的CSS文件会在全局范围内设置网站的外观，而直接在各个元素上定义的内联样式可能会覆盖您的全局CSS文件。 内联样式和!important都被认为是非常不好的做法，但是有时你可以在CSS文件里用!important去覆盖内联样式。

      +

      全局的 CSS 文件会在全局范围内设置网站的外观，而直接在各个元素上定义的内联样式可能会覆盖您的全局 CSS 文件。内联样式和 !important 都被认为是非常不好的做法，但是有时你可以在 CSS 文件里用 !important 去覆盖内联样式。

      在这种情况下，你就可以在你全局的 CSS 文件中写一些 !important 的样式来覆盖掉那些直接写在元素上的行内样式。

      @@ -98,7 +98,7 @@
      A) 覆盖内联样式
      } -

      许多JavaScript框架和库都添加了内联样式。 有时候可以用!important与优先级高的选择器一起使用，以重写覆盖这些内联样式。

      +

      许多 JavaScript 框架和库都添加了内联样式。有时候可以用!important与优先级高的选择器一起使用，以重写覆盖这些内联样式。

      B) 覆盖优先级高的选择器
      @@ -114,7 +114,7 @@
      B) 覆盖优先级高的选择器

      怎样覆盖 !important

      -

      A)很简单，只需再添加一条 带 !important 的CSS规则，再给这个给选择器更高的优先级（添加一个标签，ID或类）；或是添加一样选择器，把它的位置放在原有声明的后面（总之，最后定义一条规则比胜）。

      +

      A) 很简单，只需再添加一条 带 !important 的 CSS 规则，再给这个给选择器更高的优先级（添加一个标签，ID 或类）；或是添加一样选择器，把它的位置放在原有声明的后面（总之，最后定义一条规则比胜）。

      一些拥有更高优先级的例子：

      @@ -123,11 +123,11 @@

      怎样覆盖 !important

      #myTable td { height: 50px !important; } -

      B)或者使用相同的选择器，但是置于已有的样式之后：

      +

      B) 或者使用相同的选择器，但是置于已有的样式之后：

      td { height: 50px !important; }
      -

      C)或干脆改写原来的规则，以避免使用 !important。

      +

      C) 或干脆改写原来的规则，以避免使用 !important。

      [id="someElement"] p {
   color: blue;
@@ -137,7 +137,7 @@ 
      怎样覆盖 !important
      
   color: red;
 }
      -

      将id作为属性选择器的一部分而不是id选择器，将使其具有与类相同的特异性。 上面的两个选择器现在具有相同的权重。 在优先级相同情况下，后面定义的CSS样式会被应用。

      +

      将 id 作为属性选择器的一部分而不是 id 选择器，将使其具有与类相同的特异性。上面的两个选择器现在具有相同的权重。在优先级相同情况下，后面定义的 CSS 样式会被应用。

      若想了解更多信息，请参考：

      @@ -156,7 +156,7 @@

      :is() 和 :not()

      :not 否定伪类在优先级计算中不会被看作是伪类。事实上，在计算选择器数量时还是会把其中的选择器当做普通选择器进行计数。

      -

      有如下 CSS 样式声明:

      +

      有如下 CSS 样式声明：

      div.outer p {
   color: orange;
@@ -188,7 +188,7 @@ 
      :where() 
 
 
      The specificity-adjustment pseudo-class {{CSSxRef(":where", ":where()")}} {{Experimental_Inline}} always has its specificity replaced with zero.
      
 
-
      有如下 CSS 样式声明:
      
+
      有如下 CSS 样式声明：
      
 
 
      div:where(.outer) p {
   color: orange;
@@ -234,7 +234,7 @@ 
      :where() 
 
 
      基于形式的优先级（Form-based specificity）
      
 
-
      优先级是基于选择器的形式进行计算的。在下面的例子中，尽管选择器*[id="foo"] 选择了一个ID，但是它还是作为一个属性选择器来计算自身的优先级。
      
+
      优先级是基于选择器的形式进行计算的。在下面的例子中，尽管选择器*[id="foo"] 选择了一个 ID，但是它还是作为一个属性选择器来计算自身的优先级。
      
 
 
      有如下样式声明：
      
 
@@ -247,7 +247,7 @@ 
      基于形式的优
 }
 
      
 
-
      将其应用在下面的HTML中：
      
+
      将其应用在下面的 HTML 中：
      
 
 
      <p id="foo">I am a sample text.</p>
 
      
@@ -258,7 +258,7 @@ 
      基于形式的优
 
 
      虽然匹配了相同的元素，但是 ID 选择器拥有更高的优先级。所以第一条样式声明生效。
      
 
-
      无视DOM树中的距离
      
+
      无视 DOM 树中的距离
      
 
 
      有如下样式声明：
      
 
@@ -282,7 +282,7 @@ 
      无视DOM树中的距离
      
 
 
      浏览器会将它渲染成：
      
 
-
      {{EmbedLiveSample("无视DOM树中的距离")}}
      
+
      {{EmbedLiveSample("无视 DOM 树中的距离")}}
      
 
 
      直接添加样式 vs. 继承样式
      
 
@@ -296,7 +296,7 @@ 
      直接添加样式 vs. 继承样
   color: purple;
 }
      -

      当它应用在下面的HTML时：

      +

      当它应用在下面的 HTML 时：

      <html>
   <body id="parent">
@@ -340,7 +340,7 @@ 
      规范

      - +
      corner1.png1个值的语法：border-radius: 1em — 这一个值表示所有的表框角度的半径1 个值的语法：border-radius: 1em — 这一个值表示所有的表框角度的半径
      corner2.png2个值的语法：border-radius: 1em 2em — 第一个值表示 top-left 和 bottom-right 方向的角；第二个值表示 top-right 和 bottom-left 方向的角2 个值的语法：border-radius: 1em 2em — 第一个值表示 top-left 和 bottom-right 方向的角；第二个值表示 top-right 和 bottom-left 方向的角
      corner3.png3个值的语法：border-radius: 1em 2em 3em — 第一个值表示 top-left 方向的角 ，第二个值表示top-right 和 bottom-left 方向的角，第三个值表示 bottom-right 方向的角3 个值的语法：border-radius: 1em 2em 3em — 第一个值表示 top-left 方向的角，第二个值表示 top-right 和 bottom-left 方向的角，第三个值表示 bottom-right 方向的角
      corner4.png -

      4个值的语法：border-radius: 1em 2em 3em 4em — 这四个值分别表示top-left、 top-right、 bottom-right 、bottom-left 方向的角。总是按此顺序，即从top-left开始的顺时针顺序

      +

      4 个值的语法：border-radius: 1em 2em 3em 4em — 这四个值分别表示 top-left、top-right、bottom-right、bottom-left 方向的角。总是按此顺序，即从 top-left 开始的顺时针顺序
      {{SpecName("CSS1", "#cascading-order", "Cascading order")}} {{Spec2("CSS1")}}初始化定义.初始化定义。
      diff --git a/files/zh-cn/web/css/specified_value/index.html b/files/zh-cn/web/css/specified_value/index.html index eb6b36d4da6d28..da21946b13d224 100644 --- a/files/zh-cn/web/css/specified_value/index.html +++ b/files/zh-cn/web/css/specified_value/index.html @@ -7,12 +7,12 @@

      概述

      -

      CSS属性的 指定值 (specified value)会通过下面3种途径取得：

      +

      CSS 属性的 指定值 (specified value) 会通过下面 3 种途径取得：

      1. 在当前文档的样式表中给这个属性赋的值，会被优先使用。例如：把 {{ cssxref("color") }} 属性的值设为green ，那么对应元素内的文字就会变成绿色。
      2. 如果在当前文档的样式表中没有给这个属性赋值，那么它会尝试从父元素那继承一个值。例如：在一个 {{ HTMLElement("div") }}  内部放置一个段落 ({{ HTMLElement("p") }})，这个 {{ HTMLElement("div") }} 的 {{ cssxref("font") }} 属性值为 "Arial"，而 {{ HTMLElement("p") }} 的 {{ cssxref("font") }} 属性没有被赋值，那么它的字体就会继承为 Arial
        3. -
      3. 如果上面的两种途径都不可行，则把CSS规范中针对这个元素的这个属性的初始值作为指定值
        4. +
      4. 如果上面的两种途径都不可行，则把 CSS 规范中针对这个元素的这个属性的初始值作为指定值

      相关规范

      diff --git a/files/zh-cn/web/css/string/index.html b/files/zh-cn/web/css/string/index.html index aaf7ed4879fece..20944485bf98c3 100644 --- a/files/zh-cn/web/css/string/index.html +++ b/files/zh-cn/web/css/string/index.html @@ -5,20 +5,20 @@ ---
      {{CSSRef}}
      -
      在CSS中，<string> 是用来表示一串字符的数据类型，它被用在众多CSS属性中，例如{{cssxref("content")}}、{{cssxref("font-family")}}、和{{cssxref("quotes")}}。
      +
      在 CSS 中，<string> 是用来表示一串字符的数据类型，它被用在众多 CSS 属性中，例如{{cssxref("content")}}、{{cssxref("font-family")}}、和{{cssxref("quotes")}}。

      使用规则

      -

      <string> 数据类型是由包含在英文双引号（"）或英文单引号（'）中的任意数量的Unicode字符组成。

      +

      <string> 数据类型是由包含在英文双引号（"）或英文单引号（'）中的任意数量的 Unicode 字符组成。

      -

      大多数字符都可以写成字面量的形式，并且所有字符都可以写成以反斜线（\）开头的十六进制Unicode码点的形式。比如说：\22表示一个双引号，\27表示一个单引号，\A9表示版权声明符号（©）。

      +

      大多数字符都可以写成字面量的形式，并且所有字符都可以写成以反斜线（\）开头的十六进制 Unicode 码点的形式。比如说：\22表示一个双引号，\27表示一个单引号，\A9表示版权声明符号（©）。

      需要注意的是，在使用某些特殊字符时需要在前面加上反斜线来转义，包括但不限于在双引号字符串中使用双引号字符，在单引号字符串中使用单引号字符，以及反斜线字符，比如\\表示一个反斜线字符。

      当你想换行的时候，必须使用像\A或者\00000A这样的换行符。不过在你的代码中，可以通过在每行末尾增加一个反斜线（\）的方式来创建一个多行的字符串。

      -

      注意: CSS<string>中不能使用像&nbsp;或者&#8212;这样的实体。

      +

      注意： CSS<string>中不能使用像&nbsp;或者&#8212;这样的实体。

      例子

      diff --git a/files/zh-cn/web/css/syntax/index.html b/files/zh-cn/web/css/syntax/index.html index aa2059045195ec..2b22338b366175 100644 --- a/files/zh-cn/web/css/syntax/index.html +++ b/files/zh-cn/web/css/syntax/index.html @@ -11,7 +11,7 @@ ---
      {{cssref}}
      -

      层叠样式表（ Cascading Stylesheet ，简称CSS ）， 其基本目标是让浏览器以指定的特性去绘制页面元素，比如颜色，定位，装饰。CSS的语法反映了这个目标，由下面两个部分构建：

      +

      层叠样式表（Cascading Stylesheet，简称CSS ），其基本目标是让浏览器以指定的特性去绘制页面元素，比如颜色，定位，装饰。CSS 的语法反映了这个目标，由下面两个部分构建：

      • 属性（ property）是一个标识符，用可读的名称来表示其特性。
        • @@ -20,17 +20,17 @@

        CSS 声明

        -

        CSS的核心功能是将CSS属性设定为特定的值。一个属性与值的键值对被称为”声明“（declaration） 。CSS引擎会计算页面上每个元素都有哪些声明，并且会根据结果绘制元素，排布样式。
        +

        CSS 的核心功能是将 CSS 属性设定为特定的值。一个属性与值的键值对被称为”声明“（declaration） 。CSS 引擎会计算页面上每个元素都有哪些声明，并且会根据结果绘制元素，排布样式。

        在 CSS 中，无论是属性名还是属性值都是对大小写不敏感的。属性与值之间以英文冒号 ':' （U+003A COLON）隔开。属性与值前面、后面与两者之间的空白不是必需的，会被自动忽略。

        css syntax - declaration.png

        -

        目前CSS中有 100 多个属性 ， 并且几乎有无限多个不同的值。并非所有的属性与值的配对都是被允许的， 每个属性都定义了它的合法值。如果值对给定的属性而言非法时，声明就会被视为无效的，整个声明就会被CSS引擎忽略。

        +

        目前 CSS 中有 100 多个属性 ，并且几乎有无限多个不同的值。并非所有的属性与值的配对都是被允许的，每个属性都定义了它的合法值。如果值对给定的属性而言非法时，声明就会被视为无效的，整个声明就会被 CSS 引擎忽略。

        CSS 声明块

        -

        声明会按照块的形式被组合。声明块（declaration block）以英文左大括号('{' U+007B LEFT CURLY BRACKET)开始，以英文右大括号 '}' (U+007D RIGHT CURLY BRACKET)结束。块有时会嵌套，所以开始与结束大括号必须要匹配。

        +

        声明会按照块的形式被组合。声明块（declaration block）以英文左大括号 ('{' U+007B LEFT CURLY BRACKET) 开始，以英文右大括号 '}' (U+007D RIGHT CURLY BRACKET) 结束。块有时会嵌套，所以开始与结束大括号必须要匹配。

        css syntax - block.png

        @@ -38,17 +38,17 @@

        CSS 声明块

        css syntax - declarations block.png

        -
        声明块的内容—开始与结束大括号之间的声明，可以放在HTML style 特性里。
        +
        声明块的内容—开始与结束大括号之间的声明，可以放在 HTML style 特性里。

        CSS 规则

        如果样式表只能为每个页面元素添加一个声明，那就没有真正发挥出它的价值。其真正的目标是为文档不同部分添加不同的声明。

        - 为此，CSS可以在声明块前面放置选择器（selector)，选择器用来选择页面多个元素的条件。一对选择器与声明块称为规则集（ruleset)，常简称为规则（rule)。

        + 为此，CSS 可以在声明块前面放置选择器（selector)，选择器用来选择页面多个元素的条件。一对选择器与声明块称为规则集（ruleset)，常简称为规则（rule)。

        css syntax - ruleset.png

        -

        一个元素可能被多个选择器选中，因此会有多个规则，有可能以不同的值去设置同一属性。CSS标准会规定哪个优先级最高并生效, 称之为 层叠（cascade) 算法。

        +

        一个元素可能被多个选择器选中，因此会有多个规则，有可能以不同的值去设置同一属性。CSS 标准会规定哪个优先级最高并生效，称之为 层叠（cascade) 算法。

        有一点需要注意的是，尽管用一组选择器来定义的单个规则集，比用多个单一选择器来定义的多个规则集更加简洁，但这却不适用于规则集的有效性。

        @@ -65,14 +65,14 @@

        CSS 语句

        语句类型：

          -
        • 规则。如上，将一组CSS声明与用选择器定义的条件相关联。
          • -
        • at规则（at-rules）。以@ (U+0040 COMMERCIAL AT) 开始，随后是标识符，一直到以分号或右大括号结束。每个at规则由其标识符定义，可能有它自己的语法。at规则涵盖了meta信息（比如 @charset  @import)，条件信息（比如@media  @document), 描述信息（比如@font-face)。
          • +
        • 规则。如上，将一组 CSS 声明与用选择器定义的条件相关联。
          • +
        • at 规则（at-rules）。以 @ (U+0040 COMMERCIAL AT) 开始，随后是标识符，一直到以分号或右大括号结束。每个 at 规则由其标识符定义，可能有它自己的语法。at 规则涵盖了 meta 信息（比如 @charset  @import)，条件信息（比如 @media  @document), 描述信息（比如 @font-face)。

        不是上面类型的语句则是非法的，被忽略。

        - 条件规则组（conditional group rules）是特殊的at规则，可以嵌套语句。它里面的语句只有在特定条件下才生效。
        - CSS1 与 CSS2.1 下， 条件规则组里面只能用规则。CSS3 下还可以用一些但不是全部的at规则，见CSS Conditionals Level 3。

        + 条件规则组（conditional group rules）是特殊的 at 规则，可以嵌套语句。它里面的语句只有在特定条件下才生效。
        + CSS1 与 CSS2.1 下，条件规则组里面只能用规则。CSS3 下还可以用一些但不是全部的 at 规则，见CSS Conditionals Level 3。

        其它