From 9af98e09ccb1173b5f4dd72f06e97ddbc548418e Mon Sep 17 00:00:00 2001 From: Jason Lee Date: Sat, 28 May 2022 17:21:47 +0800 Subject: [PATCH 1/3] AutoCorrect files/zh-cn/web/css/@*/ --- files/zh-cn/web/css/@charset/index.html | 16 ++++----- .../additive-symbols/index.html | 2 +- files/zh-cn/web/css/@counter-style/index.html | 18 +++++----- .../web/css/@counter-style/pad/index.html | 4 +-- files/zh-cn/web/css/@document/index.html | 12 +++---- .../css/@font-face/font-display/index.html | 2 +- .../web/css/@font-face/font-style/index.html | 2 +- files/zh-cn/web/css/@font-face/index.html | 28 +++++++-------- files/zh-cn/web/css/@font-face/src/index.html | 4 +-- .../web/css/@font-feature-values/index.html | 2 +- files/zh-cn/web/css/@import/index.html | 12 +++---- files/zh-cn/web/css/@keyframes/index.html | 10 +++--- files/zh-cn/web/css/@layer/index.md | 10 +++--- .../-webkit-device-pixel-ratio/index.html | 2 +- .../web/css/@media/any-pointer/index.html | 4 +-- .../web/css/@media/aspect-ratio/index.html | 6 ++-- .../web/css/@media/device-height/index.html | 4 +-- files/zh-cn/web/css/@media/index.html | 12 +++---- .../@media/prefers-reduced-motion/index.html | 2 +- files/zh-cn/web/css/@media/width/index.html | 6 ++-- files/zh-cn/web/css/@namespace/index.html | 12 +++---- files/zh-cn/web/css/@page/index.html | 2 +- files/zh-cn/web/css/@property/index.html | 14 ++++---- .../web/css/@property/inherits/index.html | 6 ++-- .../css/@property/initial-value/index.html | 10 +++--- .../zh-cn/web/css/@property/syntax/index.html | 36 +++++++++---------- files/zh-cn/web/css/@supports/index.html | 20 +++++------ files/zh-cn/web/css/@viewport/index.html | 16 ++++----- 28 files changed, 137 insertions(+), 137 deletions(-) diff --git a/files/zh-cn/web/css/@charset/index.html b/files/zh-cn/web/css/@charset/index.html index 2b4006a9efd44b..6a2aaa768e698c 100644 --- a/files/zh-cn/web/css/@charset/index.html +++ b/files/zh-cn/web/css/@charset/index.html @@ -11,7 +11,7 @@

概述

-

 @charset CSS @规则  指定样式表中使用的字符编码。它必须是样式表中的第一个元素,而前面不得有任何字符。因为它不是一个嵌套语句,所以不能在@规则条件组中使用。如果有多个 @charset @规则被声明,只有第一个会被使用,而且不能在HTML元素或HTML页面的字符集相关 {{ HTMLElement("style") }} 元素内的样式属性内使用。

+

 @charset CSS @规则  指定样式表中使用的字符编码。它必须是样式表中的第一个元素,而前面不得有任何字符。因为它不是一个嵌套语句,所以不能在@规则条件组中使用。如果有多个 @charset @规则被声明,只有第一个会被使用,而且不能在 HTML 元素或 HTML 页面的字符集相关 {{ HTMLElement("style") }} 元素内的样式属性内使用。

此 @规则 在某些 CSS 属性中使用非 ASCII 字符时非常有用,例如 {{ cssxref("content") }}。

@@ -19,7 +19,7 @@

概述

  1. 文件的开头的 Unicode byte-order 字符值。
  2. -
  3. 由Content-Type:HTTP header 中的 charset 属性给出的值或用于提供样式表的协议中的等效值。
  4. +
  5. 由 Content-Type:HTTP header 中的 charset 属性给出的值或用于提供样式表的协议中的等效值。
  6. CSS @规则  @charset。
  7. 使用参考文档定义的字符编码: {{ HTMLElement("link") }} 元素的 charset 属性。 该方法在 HTML5 标准中已废除,无法使用。
  8. 假设文档是 UTF-8。
  9. @@ -35,7 +35,7 @@

    语法

    charset
    -
    它是一个 {{cssxref("<string>")}} 表示字符编码被使用。它必须是在被 IANA-registry 声明过的 web-safe 字符编码中的一个, 还必须被双引号包围, 遵循一个空格字符 (U+0020),并且立即以分号结束。 如果有多个相关的编码名字,只有被标记为 preferred  的那个才会被使用。
    +
    它是一个 {{cssxref("<string>")}} 表示字符编码被使用。它必须是在被 IANA-registry 声明过的 web-safe 字符编码中的一个,还必须被双引号包围,遵循一个空格字符 (U+0020),并且立即以分号结束。 如果有多个相关的编码名字,只有被标记为 preferred  的那个才会被使用。

    语法格式

    @@ -46,11 +46,11 @@

    例子

    @charset "UTF-8";
     @charset "utf-8"; /*大小写不敏感*/
    -/* 设置css的编码格式为Unicode UTF-8 */
    -@charset 'iso-8859-15'; /* 无效的, 使用了错误的引号 */
    -@charset 'UTF-8';       /* 无效的, 使用了错误的引号 */
    -@charset  "UTF-8";      /* 无效的, 多于一个空格 */
    - @charset "UTF-8";      /* 无效的, 在at-rule之前多了一个空格 */
    +/* 设置 css 的编码格式为 Unicode UTF-8 */
    +@charset 'iso-8859-15'; /* 无效的,使用了错误的引号 */
    +@charset 'UTF-8';       /* 无效的,使用了错误的引号 */
    +@charset  "UTF-8";      /* 无效的,多于一个空格 */
    + @charset "UTF-8";      /* 无效的,在 at-rule 之前多了一个空格 */
     @charset UTF-8;         /* Invalid, without ' or ", the charset is not a CSS {{cssxref("<string>")}} */
     
    diff --git a/files/zh-cn/web/css/@counter-style/additive-symbols/index.html b/files/zh-cn/web/css/@counter-style/additive-symbols/index.html index 3d760857d0a5b0..42f50f2d518123 100644 --- a/files/zh-cn/web/css/@counter-style/additive-symbols/index.html +++ b/files/zh-cn/web/css/@counter-style/additive-symbols/index.html @@ -5,7 +5,7 @@ ---
    {{CSSRef}}
    -

    additive-symbols 描述符 定义符号,用于值可累积的可数的 {{cssxref('system')}}的项 。 additive-symbols定义累积的的元组(tuples),每个元组项都包含一个符号和一个非负整数的权重。additive system被用于构造sign-value numbering (符号-值,指数字的值就是是符号加在一起的值)系统,比如 罗马数字。

    +

    additive-symbols 描述符 定义符号,用于值可累积的可数的 {{cssxref('system')}}的项 。 additive-symbols 定义累积的的元组(tuples),每个元组项都包含一个符号和一个非负整数的权重。additive system 被用于构造sign-value numbering (符号 - 值,指数字的值就是是符号加在一起的值)系统,比如 罗马数字。

    additive-symbols: 3 "0";
     additive-symbols: 3 "0", 2 "\2E\20";
    diff --git a/files/zh-cn/web/css/@counter-style/index.html b/files/zh-cn/web/css/@counter-style/index.html
    index 90f435d736302e..edcb8995fe1590 100644
    --- a/files/zh-cn/web/css/@counter-style/index.html
    +++ b/files/zh-cn/web/css/@counter-style/index.html
    @@ -7,9 +7,9 @@
     
     

    概要

    -

    @counter-style是一个 CSS at-rule ,它让开发者可以自定义counter的样式。 一个 @counter-style规则 定义了如何把一个计数器的值转化为字符串表示。

    +

    @counter-style 是一个 CSS at-rule ,它让开发者可以自定义 counter 的样式。 一个 @counter-style 规则 定义了如何把一个计数器的值转化为字符串表示。

    -

    最初版的CSS定义了一系列很好用的计数器样式, 尽管近几年又添加了很多样式,但是这种限制方式被证明已经不能满足全球化的排版了。@counter-style规则用一种开放的方式弥补了这一缺点,在预定义的样式不能满足需求时,它可以使开发者自定义他们自己的计数器样式。

    +

    最初版的 CSS 定义了一系列很好用的计数器样式, 尽管近几年又添加了很多样式,但是这种限制方式被证明已经不能满足全球化的排版了。@counter-style 规则用一种开放的方式弥补了这一缺点,在预定义的样式不能满足需求时,它可以使开发者自定义他们自己的计数器样式。

    语法

    @@ -50,17 +50,17 @@

    描述

    {{cssxref("suffix")}}
    -
    与{{cssxref("prefix")}}类似,suffix指定一个符号,加在标记表示符的后面。
    +
    与{{cssxref("prefix")}}类似,suffix 指定一个符号,加在标记表示符的后面。
    {{cssxref("range")}}
    -
     指定一个counter-style生效的范围,如果计数器的值不再这个范围内,那么自定义的counter-style不会生效,counter-style会后退到{{cssxref("fallback")}}的style。
    +
     指定一个 counter-style 生效的范围,如果计数器的值不再这个范围内,那么自定义的 counter-style 不会生效,counter-style 会后退到{{cssxref("fallback")}}的 style。
    {{cssxref("pad")}}
    -
    在你想要给标记表示符最小值时使用。比如说,你想要计数器从01开始,经过02,03,04,那么这时可以使用pad了。对于大于pad指定值的表示符,标记会恢复为normal。
    +
    在你想要给标记表示符最小值时使用。比如说,你想要计数器从 01 开始,经过 02,03,04,那么这时可以使用 pad 了。对于大于 pad 指定值的表示符,标记会恢复为 normal。
    @@ -70,9 +70,9 @@

    描述

    {{cssxref("symbols-descriptor", "symbols")}}
    -
    定义一个符号,用于标记的表示。符号可以包含字符串,图片或自定义的识别码。这个符号怎样构建标记呢?这依赖于system描述符里面所定义的算法。 举个例子,如果system的值是fixed,那么symbols属性指定的固定的N个符号,将被用来表示计数器的前N个值。用完了前N个符号后,列表里剩下的值将使用fallback定义的样式来表示。
    +
    定义一个符号,用于标记的表示。符号可以包含字符串,图片或自定义的识别码。这个符号怎样构建标记呢?这依赖于 system 描述符里面所定义的算法。 举个例子,如果 system 的值是 fixed,那么 symbols 属性指定的固定的 N 个符号,将被用来表示计数器的前 N 个值。用完了前 N 个符号后,列表里剩下的值将使用 fallback 定义的样式来表示。

    - 下面的@counter-style规则使用图片而不是字符标记。
    + 下面的 @counter-style 规则使用图片而不是字符标记。
    @counter-style winners-list {
       system: fixed;
    @@ -84,7 +84,7 @@ 

    描述

    {{cssxref("additive-symbols")}}
    -
    尽管symbols属性中指定的符号可以被system中定义的大部分算法所使用,但是一些system属性的值,比如additive,依赖于本描述符所描述的加性元组。Each additive tuple consists of a counter symbol and a non negative integer weight. 每个加性元组包含一个可数的符号和一个非负证书的权重。The additive tuples must be specified in the descending order of their weights.
    +
    尽管 symbols 属性中指定的符号可以被 system 中定义的大部分算法所使用,但是一些 system 属性的值,比如 additive,依赖于本描述符所描述的加性元组。Each additive tuple consists of a counter symbol and a non negative integer weight. 每个加性元组包含一个可数的符号和一个非负证书的权重。The additive tuples must be specified in the descending order of their weights.
    @@ -100,7 +100,7 @@

    例子

    suffix: " "; }
    -

    上面的counter style规则在列表中可以如下使用:

    +

    上面的 counter style 规则在列表中可以如下使用:

    .items {
        list-style: circled-alpha;
    diff --git a/files/zh-cn/web/css/@counter-style/pad/index.html b/files/zh-cn/web/css/@counter-style/pad/index.html
    index e4bccf1733c122..2aff9f0396dff9 100644
    --- a/files/zh-cn/web/css/@counter-style/pad/index.html
    +++ b/files/zh-cn/web/css/@counter-style/pad/index.html
    @@ -5,7 +5,7 @@
     ---
     
    {{CSSRef}}
    -

    pad属性和自定义记数样式一起使用时, 可以用来限定记数样式的最小长度. 如果某个记数样式小于pad所指定的长度, 那么会用pad指定的填充字符串来填充至指定长度. 如果比pad所指定的长度长, 则会正常显示. Pad 属性的第一个参数是最小长度, 第二个参数是填充字符串. 一个常见的用处是序号编号需要填充两位的时候, 即需要编号"01","02","03",……, 而不仅仅是1, 2, 3...

    +

    pad属性和自定义记数样式一起使用时,可以用来限定记数样式的最小长度。如果某个记数样式小于 pad 所指定的长度,那么会用 pad 指定的填充字符串来填充至指定长度。如果比 pad 所指定的长度长,则会正常显示. Pad 属性的第一个参数是最小长度,第二个参数是填充字符串。一个常见的用处是序号编号需要填充两位的时候,即需要编号"01","02","03",……, 而不仅仅是 1, 2, 3...

    {{cssinfo}}

    @@ -18,7 +18,7 @@

    参数值

    <integer> && <symbol>
    -
    <integer> 表示所有计数样式必须达到的最小长度(必须是非负整数). 如果指定的最小长度没有达到, 将会用<symbol>来填充直到最小长度.
    +
    <integer> 表示所有计数样式必须达到的最小长度 (必须是非负整数). 如果指定的最小长度没有达到,将会用<symbol>来填充直到最小长度。

    形式语法

    diff --git a/files/zh-cn/web/css/@document/index.html b/files/zh-cn/web/css/@document/index.html index 0f15af0f551ba2..a6bfdc196f8376 100644 --- a/files/zh-cn/web/css/@document/index.html +++ b/files/zh-cn/web/css/@document/index.html @@ -19,7 +19,7 @@

    语法

    -

    @document 规则可以指定一个或多个匹配函数。如果任何功能适用于给定的 URL,则该规则将对该URL生效。可用的函数如下:

    +

    @document 规则可以指定一个或多个匹配函数。如果任何功能适用于给定的 URL,则该规则将对该 URL 生效。可用的函数如下:

    • url(),匹配整个 URL。
    • @@ -30,7 +30,7 @@

      语法

      提供给 url()url-prefix(),和 domain() 函数的参数可以不使用引号括起来。但提供给 regexp() 函数的参数必须用引号括起来。

      -

      提供给 regexp() 函数的正则表达式中的转义字符必须再次进行一次 CSS 转义。例如,一个点号(.),在正则表达式中匹配任意换行符之外的字母.如果想要匹配一个正真的点号,必须首先按照正则表达式的规则转义一次(变为 \.)然后在使用CSS的规则再转义一次(转换为\\.)。

      +

      提供给 regexp() 函数的正则表达式中的转义字符必须再次进行一次 CSS 转义。例如,一个点号(.),在正则表达式中匹配任意换行符之外的字母。如果想要匹配一个正真的点号,必须首先按照正则表达式的规则转义一次(变为 \.)然后在使用 CSS 的规则再转义一次(转换为\\.)。

      例子

      @@ -39,11 +39,11 @@

      例子

      domain(mozilla.org), regexp("https:.*") { - /* 该条CSS规则会应用在下面的网页: - + URL为"http://www.w3.org/"的页面. - + 任何URL以"http://www.w3.org/Style/"开头的网页 + /* 该条 CSS 规则会应用在下面的网页: + + URL 为"http://www.w3.org/"的页面。 + + 任何 URL 以"http://www.w3.org/Style/"开头的网页 + 任何主机名为"mozilla.org"或者主机名以".mozilla.org"结尾的网页 - + 任何URL以"https:"开头的网页 */ + + 任何 URL 以"https:"开头的网页 */ /* 让上述网页变得超级丑 */ body { diff --git a/files/zh-cn/web/css/@font-face/font-display/index.html b/files/zh-cn/web/css/@font-face/font-display/index.html index a57538bdb03470..77ff43ae051fd0 100644 --- a/files/zh-cn/web/css/@font-face/font-display/index.html +++ b/files/zh-cn/web/css/@font-face/font-display/index.html @@ -9,7 +9,7 @@ ---
      {{CSSRef}}
      -

      font-display 属性决定了一个@font-face 在不同的下载时间和可用时间下是如何展示的。

      +

      font-display 属性决定了一个 @font-face 在不同的下载时间和可用时间下是如何展示的。

      字体显示时间轴

      diff --git a/files/zh-cn/web/css/@font-face/font-style/index.html b/files/zh-cn/web/css/@font-face/font-style/index.html index 660323dade23a9..2ab79cda0649cb 100644 --- a/files/zh-cn/web/css/@font-face/font-style/index.html +++ b/files/zh-cn/web/css/@font-face/font-style/index.html @@ -7,7 +7,7 @@

      概述

      -

      font-style 描述符允许开发者在@font-rule规则中为指定字体样式(该条目区别于font-style,意指用在@font-rule中的font-style属性)

      +

      font-style 描述符允许开发者在 @font-rule 规则中为指定字体样式 (该条目区别于 font-style,意指用在 @font-rule 中的 font-style 属性)

      For a particular font family, authors can download various font faces which correspond to the different styles of the same font family, and then use the font-style descriptor to explicitly specify the font face's style. The values for the CSS descriptor is same as that of its corresponding font property.

      diff --git a/files/zh-cn/web/css/@font-face/index.html b/files/zh-cn/web/css/@font-face/index.html index 59fcb501dbddc3..60ac61388a8479 100644 --- a/files/zh-cn/web/css/@font-face/index.html +++ b/files/zh-cn/web/css/@font-face/index.html @@ -8,19 +8,19 @@ ---
      {{CSSRef}}
      -
      @font-face CSS at-rule 指定一个用于显示文本的自定义字体;字体能从远程服务器或者用户本地安装的字体加载. 如果提供了local()函数,从用户本地查找指定的字体名称,并且找到了一个匹配项, 本地字体就会被使用. 否则, 字体就会使用url()函数下载的资源。
      +
      @font-face CSS at-rule 指定一个用于显示文本的自定义字体;字体能从远程服务器或者用户本地安装的字体加载。如果提供了 local() 函数,从用户本地查找指定的字体名称,并且找到了一个匹配项,本地字体就会被使用。否则,字体就会使用 url() 函数下载的资源。
      -
      通过允许作者提供他们自己的字体,@font-face 让设计内容成为了一种可能,同时并不会被所谓的"网络-安全"字体所限制(字体如此普遍以至于它们能被广泛的使用). 指定查找和使用本地安装的字体名称可以让字体的自定义化程度超过基本字体,同时在不依赖网络情况下实现此功能。
      +
      通过允许作者提供他们自己的字体,@font-face 让设计内容成为了一种可能,同时并不会被所谓的"网络 - 安全"字体所限制 (字体如此普遍以至于它们能被广泛的使用). 指定查找和使用本地安装的字体名称可以让字体的自定义化程度超过基本字体,同时在不依赖网络情况下实现此功能。
      -
      在同时使用url()和local()功能时,为了用户已经安装的字体副本在需要使用时被使用,如果在用户本地没有找到字体副本就会去使用户下载的副本查找字体。
      +
      在同时使用 url() 和 local() 功能时,为了用户已经安装的字体副本在需要使用时被使用,如果在用户本地没有找到字体副本就会去使用户下载的副本查找字体。
      -
      @font-face 规则不仅仅使用在CSS的顶层,还可以用在任何CSS条件组规则中.
      +
      @font-face 规则不仅仅使用在 CSS 的顶层,还可以用在任何 CSS 条件组规则中。
      @@ -32,7 +32,7 @@

      概述

      -

      这是一个叫做@font-faceCSS @规则 ,它允许网页开发者为其网页指定在线字体。 通过这种作者自备字体的方式,@font-face 可以消除对用户电脑字体的依赖。 @font-face 不仅可以放在在CSS的最顶层, 也可以放在 @规则 的 条件规则组 中。

      +

      这是一个叫做@font-faceCSS @规则 ,它允许网页开发者为其网页指定在线字体。 通过这种作者自备字体的方式,@font-face 可以消除对用户电脑字体的依赖。 @font-face 不仅可以放在在 CSS 的最顶层,也可以放在 @规则 的 条件规则组 中。

      语法

      @@ -42,9 +42,9 @@

      取值

      {{cssxref("@font-face/font-family", "font-family")}}
      -
      所指定的字体名字将会被用于font或font-family属性( i.e. font-family: <family-name>; )
      +
      所指定的字体名字将会被用于 font 或 font-family 属性 ( i.e. font-family: <family-name>; )
      {{cssxref("@font-face/src", "src")}}
      -
      远程字体文件位置的URL或者用户计算机上的字体名称, 可以使用local语法通过名称指定用户的本地计算机上的字体( i.e. src: local('Arial'); )。 如果找不到该字体,将会尝试其他来源,直到找到它。
      +
      远程字体文件位置的 URL 或者用户计算机上的字体名称, 可以使用 local 语法通过名称指定用户的本地计算机上的字体 ( i.e. src: local('Arial'); )。 如果找不到该字体,将会尝试其他来源,直到找到它。
      {{cssxref("@font-face/font-variant", "font-variant")}}
      A {{cssxref("font-variant")}} value.
      {{cssxref("@font-face/font-stretch", "font-stretch")}}
      @@ -52,14 +52,14 @@

      取值

      {{cssxref("@font-face/font-weight", "font-weight")}}
      A {{cssxref("font-weight")}} value.
      {{cssxref("@font-face/font-style", "font-style")}}
      -
      对于src所指字体的描述。如果所需字体符合描述,则采用本font-face所定义的字体。
      +
      对于 src 所指字体的描述。如果所需字体符合描述,则采用本 font-face 所定义的字体。
      {{cssxref("@font-face/unicode-range", "unicode-range")}}
      -
      在该@font-face中定义的unicode字体范围
      +
      在该 @font-face 中定义的 unicode 字体范围

      示例

      -

      下面的例子简单定义了一个可下载的字体,并应用到了文档的整个body标签上。

      +

      下面的例子简单定义了一个可下载的字体,并应用到了文档的整个 body 标签上。

      View live sample

      @@ -83,7 +83,7 @@

      示例

      -

      在接下来的例子中,用到了用户本地字体"Helvetica Neue Bold"的备份;如果当前用户(浏览器)未安装该字体(两种可能的字体名都已经试过),就会用下载的字体"MgOpenModernaBold.ttf"来代替:

      +

      在接下来的例子中,用到了用户本地字体"Helvetica Neue Bold"的备份;如果当前用户 (浏览器) 未安装该字体 (两种可能的字体名都已经试过),就会用下载的字体"MgOpenModernaBold.ttf"来代替:

      @font-face {
         font-family: MyHelvetica;
      @@ -100,7 +100,7 @@ 

      示例

      接下来的例子在英文原文中已被删除。

      -

      这个例子新定义了一个字体,正常粗细的字采用字体Times New Roman,粗体字采用Consolas。

      +

      这个例子新定义了一个字体,正常粗细的字采用字体 Times New Roman,粗体字采用 Consolas。

      @font-face {
           font-family: myFirstFont;
      @@ -118,8 +118,8 @@ 

      示例

      注意

        -
      • 这里使用的Web fonts 仍然受到同域限制  (字体文件必须和调用它的网页同一域), 但可以使用 HTTP access controls 解除这一限制。
      • -
      • 因为这里没有为 TrueType(ttf), OpenType(otf) 和 Web Open File Format(WOFF) 字体定义MIME,因此不能为这些字体类型设置特定的MIME(实际上WOFF的MIME将会是application/font-woff,但浏览器对此MIME的识别还不统一,其它字体情况也类似,可暂时使用application/octet-stream)。 
      • +
      • 这里使用的 Web fonts 仍然受到同域限制  (字体文件必须和调用它的网页同一域), 但可以使用 HTTP access controls 解除这一限制。
      • +
      • 因为这里没有为 TrueType(ttf), OpenType(otf) 和 Web Open File Format(WOFF) 字体定义 MIME,因此不能为这些字体类型设置特定的 MIME(实际上 WOFF 的 MIME 将会是 application/font-woff,但浏览器对此 MIME 的识别还不统一,其它字体情况也类似,可暂时使用 application/octet-stream)。 
      • 你不能在一个 CSS 选择器中定义 @font-face 。例如,这样写是无效的:
        .className {
           @font-face {
        diff --git a/files/zh-cn/web/css/@font-face/src/index.html b/files/zh-cn/web/css/@font-face/src/index.html
        index 5b4370ea1e5f2c..83acef613d5714 100644
        --- a/files/zh-cn/web/css/@font-face/src/index.html
        +++ b/files/zh-cn/web/css/@font-face/src/index.html
        @@ -5,11 +5,11 @@
         ---
         
        {{CSSRef}}
        -

        {{cssxref("@font-face")}} 中的src描述符指定了包含字体数据的资源。@font-face 规则中需要指定这个属性。

        +

        {{cssxref("@font-face")}} 中的 src 描述符指定了包含字体数据的资源。@font-face 规则中需要指定这个属性。

        它的值是一个有优先级的,以逗号分割的外部引用或者本地安装的字体名称。当需要使用字体时,用户代理(指浏览器的意思)将会使用以逗号分隔的参考集中能成功激活的第一个参考值。如果是包含无效数据的字体或者本地的字体资源不存在,用户代理将会忽略当前字体并且加载下一个字体。

        -

        与CSS中的其他URL一样,URL可以是相对的,在这种情况下,它相对于包含@ font-face规则的样式表的位置进行解析。对于SVG字体,URL指向文档中定义的包含SVG字体的元素。如果省略元素引用,则默认引用第一个定义字体。同样,字体容器只加载@font-face 规则给定的其中一种字体。片段标识符用于指示要加载的字体。如果容器格式缺少定义的片段标识符方案,将会使用一个简单的基于1的索引方案(e.g., "font-collection#1" for the first font, "font-collection#2" for the second font, etc.)

        +

        与 CSS 中的其他 URL 一样,URL 可以是相对的,在这种情况下,它相对于包含 @ font-face 规则的样式表的位置进行解析。对于 SVG 字体,URL 指向文档中定义的包含 SVG 字体的元素。如果省略元素引用,则默认引用第一个定义字体。同样,字体容器只加载@font-face 规则给定的其中一种字体。片段标识符用于指示要加载的字体。如果容器格式缺少定义的片段标识符方案,将会使用一个简单的基于 1 的索引方案(e.g., "font-collection#1" for the first font, "font-collection#2" for the second font, etc.)

        {{cssinfo}}

        diff --git a/files/zh-cn/web/css/@font-feature-values/index.html b/files/zh-cn/web/css/@font-feature-values/index.html index 5995a0e71945d0..5ee7b629c5933a 100644 --- a/files/zh-cn/web/css/@font-feature-values/index.html +++ b/files/zh-cn/web/css/@font-feature-values/index.html @@ -7,7 +7,7 @@

        概要

        -

        @font-feature-values CSS at-rule 允许作者在{{cssxref("font-variant-alternates")}} 中使用通用名称,用于在OpenType中以不同方式激活功能。它允许在使用几种字体时简化CSS。

        +

        @font-feature-values CSS at-rule 允许作者在{{cssxref("font-variant-alternates")}} 中使用通用名称,用于在 OpenType 中以不同方式激活功能。它允许在使用几种字体时简化 CSS。

        @font-feature-values Font One { /* How to activate nice-style in Font One */
           @styleset {
        diff --git a/files/zh-cn/web/css/@import/index.html b/files/zh-cn/web/css/@import/index.html
        index bd6fe828196279..f8eca0397a9093 100644
        --- a/files/zh-cn/web/css/@import/index.html
        +++ b/files/zh-cn/web/css/@import/index.html
        @@ -10,9 +10,9 @@
         
         

        概述

        -

        @import CSS@规则,用于从其他样式表导入样式规则。这些规则必须先于所有其他类型的规则,{{cssxref("@charset")}} 规则除外; 因为它不是一个嵌套语句,@import不能在条件组的规则中使用。

        +

        @import CSS@规则,用于从其他样式表导入样式规则。这些规则必须先于所有其他类型的规则,{{cssxref("@charset")}} 规则除外; 因为它不是一个嵌套语句,@import 不能在条件组的规则中使用。

        -

        因此,用户代理可以避免为不支持的媒体类型检索资源,作者可以指定依赖媒体的@import规则。这些条件导入在URI之后指定逗号分隔的媒体查询。在没有任何媒体查询的情况下,导入是无条件的。指定所有的媒体具有相同的效果。

        +

        因此,用户代理可以避免为不支持的媒体类型检索资源,作者可以指定依赖媒体的 @import 规则。这些条件导入在 URI 之后指定逗号分隔的媒体查询。在没有任何媒体查询的情况下,导入是无条件的。指定所有的媒体具有相同的效果。

        语法

        @@ -20,13 +20,13 @@

        语法

        @import url list-of-media-queries;
        -

        其中:

        +

        其中:

        url
        是一个表示要引入资源位置的 {{cssxref("<string>")}} 或者 {{cssxref("<uri>")}} 。 这个 URL 可以是绝对路径或者相对路径。 要注意的是这个 URL 不需要指明一个文件; 可以只指明包名,然后合适的文件会被自动选择 (e.g. chrome://communicator/skin/). See here 了解更多。
        list-of-media-queries
        -
        是一个逗号分隔的 媒体查询 条件列表,决定通过URL引入的 CSS 规则 在什么条件下应用。如果浏览器不支持列表中的任何一条媒体查询条件,就不会引入URL指明的CSS文件。
        +
        是一个逗号分隔的 媒体查询 条件列表,决定通过 URL 引入的 CSS 规则 在什么条件下应用。如果浏览器不支持列表中的任何一条媒体查询条件,就不会引入 URL 指明的 CSS 文件。

        正规语法

        @@ -62,8 +62,8 @@

        技术规格

        {{SpecName('CSS2.1', 'cascade.html#at-import', '@import')}} {{Spec2('CSS2.1')}} - 支持用{{cssxref("<string>")}}直接表示样式表的url,
        - 并要求@import规则必须在CSS文档的开头。 + 支持用{{cssxref("<string>")}}直接表示样式表的 url,
        + 并要求@import规则必须在 CSS 文档的开头。 {{SpecName('CSS1', '#the-cascade', '@import')}} diff --git a/files/zh-cn/web/css/@keyframes/index.html b/files/zh-cn/web/css/@keyframes/index.html index d0e70a3640340c..385996edcc8a8a 100644 --- a/files/zh-cn/web/css/@keyframes/index.html +++ b/files/zh-cn/web/css/@keyframes/index.html @@ -9,7 +9,7 @@ ---
        {{CSSRef}}
        -

        关键帧 @keyframes at-rule 规则通过在动画序列中定义关键帧(或waypoints)的样式来控制CSS动画序列中的中间步骤。和 转换 transition 相比,关键帧 keyframes 可以控制动画序列的中间步骤。

        +

        关键帧 @keyframes at-rule 规则通过在动画序列中定义关键帧(或 waypoints)的样式来控制 CSS 动画序列中的中间步骤。和 转换 transition 相比,关键帧 keyframes 可以控制动画序列的中间步骤。

        @keyframes slidein {
           from {
        @@ -21,9 +21,9 @@
           }
         }
        -

        JavaScript 可以通过 CSS对象模型的 {{domxref("CSSKeyframesRule")}} 接口来访问 @keyframes

        +

        JavaScript 可以通过 CSS 对象模型的 {{domxref("CSSKeyframesRule")}} 接口来访问 @keyframes

        -

        要使用关键帧, 先创建一个带名称的 @keyframes 规则,以便后续使用 {{ cssxref("animation-name") }} 属性将动画同其关键帧声明匹配。每个 @keyframes 规则包含多个关键帧,也就是一段样式块语句,每个关键帧有一个百分比值作为名称,代表在动画进行中,在哪个阶段触发这个帧所包含的样式。

        +

        要使用关键帧,先创建一个带名称的 @keyframes 规则,以便后续使用 {{ cssxref("animation-name") }} 属性将动画同其关键帧声明匹配。每个 @keyframes 规则包含多个关键帧,也就是一段样式块语句,每个关键帧有一个百分比值作为名称,代表在动画进行中,在哪个阶段触发这个帧所包含的样式。

        可以按任意顺序列出关键帧百分比;它们将按照其应该发生的顺序来处理。

        @@ -35,9 +35,9 @@

        让关键帧序列生效

        重复定义

        -

        如果多个关键帧使用同一个名称,以最后一次定义的为准。 @keyframes 不存在层叠样式(cascade)的情况,所以动画在一个时刻(阶段)只会使用一个的关键帧的数据。

        +

        如果多个关键帧使用同一个名称,以最后一次定义的为准。 @keyframes 不存在层叠样式 (cascade) 的情况,所以动画在一个时刻(阶段)只会使用一个的关键帧的数据。

        -

        如果一个@keyframes 内的关键帧的百分比存在重复的情况,则@keyframes规则中该百分比的所有关键帧都将用于该帧。如果多个关键帧指定了相同的百分比值,则@keyframes规则内是可以使用层叠样式的。

        +

        如果一个 @keyframes 内的关键帧的百分比存在重复的情况,则 @keyframes 规则中该百分比的所有关键帧都将用于该帧。如果多个关键帧指定了相同的百分比值,则 @keyframes 规则内是可以使用层叠样式的。

        属性个数不定

        diff --git a/files/zh-cn/web/css/@layer/index.md b/files/zh-cn/web/css/@layer/index.md index 3618117aa96096..57c4179bed1ee5 100644 --- a/files/zh-cn/web/css/@layer/index.md +++ b/files/zh-cn/web/css/@layer/index.md @@ -22,7 +22,7 @@ browser-compat: css.at-rules.layer ## 语法 -`@layer` @规则可以通过三种方式其一来创建级联层。第一种方法如上方代码所示,它创建了一个块级的@规则,其中包含作用于该层内部的CSS规则。 +`@layer` @规则可以通过三种方式其一来创建级联层。第一种方法如上方代码所示,它创建了一个块级的 @规则,其中包含作用于该层内部的 CSS 规则。 ```css @layer utilities { @@ -56,9 +56,9 @@ browser-compat: css.at-rules.layer 这一做法很有用,因为层最初被指定的顺序决定了它是否有优先级。对于声明而言,如果同一声明在多个级联层中被指定,最后一层中的将优先于其他层。因此,在上面的例子中,如果 `theme` 层和 `utilities` 层中存在冲突的规则,那么 `utilities` 层中的将优先被应用。 -即使 `utilities` 层中规则的 _优先级低于_ `theme` 层中的,该规则仍会被应用。一旦级联层顺序建立之后,优先级和出现顺序都会被忽略。这将使创建CSS选择器变得更加简单,因为你不需要确保每一个选择器都有足够高的优先级来覆盖其他冲突的规则,你只需要确保它们出现在一个顺序更靠后的级联层中。 +即使 `utilities` 层中规则的 _优先级低于_ `theme` 层中的,该规则仍会被应用。一旦级联层顺序建立之后,优先级和出现顺序都会被忽略。这将使创建 CSS 选择器变得更加简单,因为你不需要确保每一个选择器都有足够高的优先级来覆盖其他冲突的规则,你只需要确保它们出现在一个顺序更靠后的级联层中。 -> **注**:在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加CSS规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 +> **注**:在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加 CSS 规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 其他不属于任何一级联层的样式将被集中到同一匿名层,并置于所有层的后部,这意味着任何在层外声明的样式都会覆盖在层内声明的样式。 @@ -106,7 +106,7 @@ browser-compat: css.at-rules.layer ### 基本例子 -下方的例子创建了两条CSS规则。其中一条为 `type` 层内部的 {{htmlelement("p")}} 元素创建。另一条规则创建于级联层外部,作用于 `.box p`。 +下方的例子创建了两条 CSS 规则。其中一条为 `type` 层内部的 {{htmlelement("p")}} 元素创建。另一条规则创建于级联层外部,作用于 `.box p`。 没有级联层时,选择器 `.box p` 将会有最高的优先级,因此文字 `Hello, world!` 将被显示为绿色。当`type`层应用在匿名层创建之前时,文本将会是紫色的。 @@ -142,7 +142,7 @@ p { ### 向已存在的层中添加规则 -下方的例子创建了两个没有规则的级联层,随后,CSS规则被添加到这两层中。`base` 层定义了color、border、font-size和padding。`special` 层定义了不同的color属性。因为 `special` 层在定义时排在最后,其中的color属性将被应用,文字的颜色将显示为`rebeccapurple`。`base` 层中的其他规则仍然有效。 +下方的例子创建了两个没有规则的级联层,随后,CSS 规则被添加到这两层中。`base` 层定义了 color、border、font-size 和 padding。`special` 层定义了不同的 color 属性。因为 `special` 层在定义时排在最后,其中的 color 属性将被应用,文字的颜色将显示为`rebeccapurple`。`base` 层中的其他规则仍然有效。 #### HTML diff --git a/files/zh-cn/web/css/@media/-webkit-device-pixel-ratio/index.html b/files/zh-cn/web/css/@media/-webkit-device-pixel-ratio/index.html index d3f3cd202ce4a0..c8764c1acccc76 100644 --- a/files/zh-cn/web/css/@media/-webkit-device-pixel-ratio/index.html +++ b/files/zh-cn/web/css/@media/-webkit-device-pixel-ratio/index.html @@ -7,7 +7,7 @@

        {{ Non-standard_header() }}

        -

        -webkit-device-pixel-ratio 是一个非标准的布尔类型CSS媒体类型,是标准 resolution 媒体类型的一个替代方案.

        +

        -webkit-device-pixel-ratio 是一个非标准的布尔类型 CSS 媒体类型,是标准 resolution 媒体类型的一个替代方案。

        Its value is the number of device pixels used to represent each CSS px. Although the value is a {{cssxref("<number>")}} and thus doesn't syntactically allow units, its implicit unit is dppx.

        diff --git a/files/zh-cn/web/css/@media/any-pointer/index.html b/files/zh-cn/web/css/@media/any-pointer/index.html index 8d05eb28d4f05d..28b47060074286 100644 --- a/files/zh-cn/web/css/@media/any-pointer/index.html +++ b/files/zh-cn/web/css/@media/any-pointer/index.html @@ -14,7 +14,7 @@

        any-pointer CSS 媒体特性 测试用户是否拥有任意定点装置(如鼠标)。以及如果存在定点装置,它的精确度是什么样的。

        -

        注: 如果你想测试定点设备的精确度, 使用 pointer 。

        +

        注: 如果你想测试定点设备的精确度,使用 pointer 。

        语法

        @@ -31,7 +31,7 @@

        语法

    -

    注: 当输入设备拥有不同特性时,可能有多于一个的值被匹配。none 仅当它们都不是定点设备时被匹配。

    +

    注: 当输入设备拥有不同特性时,可能有多于一个的值被匹配。none 仅当它们都不是定点设备时被匹配。

    示例

    diff --git a/files/zh-cn/web/css/@media/aspect-ratio/index.html b/files/zh-cn/web/css/@media/aspect-ratio/index.html index d18fb02b2b4228..e093079f1e3c47 100644 --- a/files/zh-cn/web/css/@media/aspect-ratio/index.html +++ b/files/zh-cn/web/css/@media/aspect-ratio/index.html @@ -9,11 +9,11 @@

    语法

    -

    宽高比属性被指定为{{cssxref("<ratio>")}}值来代表viewport的宽高比。其为一个范围,这意味着你可以使用min-aspect-ratiomax-aspect-ratio分别查询最小和最大的值。

    +

    宽高比属性被指定为{{cssxref("<ratio>")}}值来代表 viewport 的宽高比。其为一个范围,这意味着你可以使用min-aspect-ratiomax-aspect-ratio分别查询最小和最大的值。

    例子

    -

    下面的例子包含一个 {{htmlElement("iframe")}} ,拥有它自身的viewport。调整的<iframe>宽高来观察aspect-ratio的变化。

    +

    下面的例子包含一个 {{htmlElement("iframe")}} ,拥有它自身的 viewport。调整的<iframe>宽高来观察aspect-ratio的变化。

    HTML

    @@ -38,7 +38,7 @@

    CSS

      } } -/* 明确的宽高比, 放在最下部防止同时满足条件时的覆盖*/ +/* 明确的宽高比,放在最下部防止同时满足条件时的覆盖*/ @media (aspect-ratio: 1/1) {   div {     background: #f9a; /* red */ diff --git a/files/zh-cn/web/css/@media/device-height/index.html b/files/zh-cn/web/css/@media/device-height/index.html index 20445c8a43df4c..64f75f9b072823 100644 --- a/files/zh-cn/web/css/@media/device-height/index.html +++ b/files/zh-cn/web/css/@media/device-height/index.html @@ -5,7 +5,7 @@ ---
    {{cssref}} {{deprecated_header}}
    -

     device-height CSS media feature 可以用来测试设备的渲染高度。注意,该条媒体查询将会在 媒体查询level4(目前处于候选草案)中废弃

    +

     device-height CSS media feature 可以用来测试设备的渲染高度。注意,该条媒体查询将会在 媒体查询 level4(目前处于候选草案)中废弃

    语法

    @@ -13,7 +13,7 @@

    语法

    例子

    -

    在高度低于800px时加载指定样式

    +

    在高度低于 800px 时加载指定样式

    <link rel="stylesheet" media="screen and (max-device-height: 799px)" href="http://foo.bar.com/short-styles.css" />
    diff --git a/files/zh-cn/web/css/@media/index.html b/files/zh-cn/web/css/@media/index.html index 270ee103f795ee..00f8540b12984a 100644 --- a/files/zh-cn/web/css/@media/index.html +++ b/files/zh-cn/web/css/@media/index.html @@ -10,12 +10,12 @@ ---
    {{CSSRef}}
    -
    @media CSS @规则 可用于基于一个或多个 媒体查询 的结果来应用样式表的一部分。 使用它,您可以指定一个媒体查询和一个CSS块,当且仅当该媒体查询与正在使用其内容的设备匹配时,该CSS块才能应用于该文档。
    +
    @media CSS @规则 可用于基于一个或多个 媒体查询 的结果来应用样式表的一部分。 使用它,您可以指定一个媒体查询和一个 CSS 块,当且仅当该媒体查询与正在使用其内容的设备匹配时,该 CSS 块才能应用于该文档。
    -
    注: 在JavaScript中,可以使用{{domxref("CSSMediaRule")}}CSS对象模型接口访问使用@media创建的规则。
    +
    注: 在 JavaScript 中,可以使用{{domxref("CSSMediaRule")}}CSS 对象模型接口访问使用 @media 创建的规则。
    @@ -75,7 +75,7 @@

    示例

    }
    -

    媒体查询第4级引入了一种新的范围语法,在测试接受范围的任何特性时允许更简洁的媒体查询,如下面的示例所示:

    +

    媒体查询第 4 级引入了一种新的范围语法,在测试接受范围的任何特性时允许更简洁的媒体查询,如下面的示例所示:

    @media (height > 600px) {
         body { line-height: 1.4; }
    @@ -94,13 +94,13 @@ 

    可访问性

    empx都是有效单位,但如果用户更改浏览器文本大小,em的效果会更好。

    -

    考虑使用4级媒体查询来改善用户体验。 例如,使用prefers-reduced-motion检测用户是否已请求系统最小化其使用的动画或动作量。

    +

    考虑使用 4 级媒体查询来改善用户体验。 例如,使用prefers-reduced-motion检测用户是否已请求系统最小化其使用的动画或动作量。

    安全

    由于媒体查询可以洞察用户正在使用的设备的功能(以及扩展的功能和设计),因此有可能滥用它们来构造“指纹”来识别设备,或者至少 将其分类为某些细节,这可能是用户不希望看到的。

    -

    由于存在这种潜力,浏览器可能会选择以某种方式捏造返回的值,以防止它们被用来精确地标识计算机。 浏览器可能还会在此区域提供其他措施。 例如,如果启用了Firefox的“抵抗指纹”设置,则许多媒体查询会报告默认值,而不是代表实际设备状态的值。

    +

    由于存在这种潜力,浏览器可能会选择以某种方式捏造返回的值,以防止它们被用来精确地标识计算机。 浏览器可能还会在此区域提供其他措施。 例如,如果启用了 Firefox 的“抵抗指纹”设置,则许多媒体查询会报告默认值,而不是代表实际设备状态的值。

    规范

    @@ -154,7 +154,7 @@

    更多资料

    diff --git a/files/zh-cn/web/css/@media/prefers-reduced-motion/index.html b/files/zh-cn/web/css/@media/prefers-reduced-motion/index.html index 49de3de412eca7..08f739def8f304 100644 --- a/files/zh-cn/web/css/@media/prefers-reduced-motion/index.html +++ b/files/zh-cn/web/css/@media/prefers-reduced-motion/index.html @@ -16,7 +16,7 @@

    语法

    用户偏好

    -

    在火狐中,满足以下条件则 reduce 会生效:

    +

    在火狐中,满足以下条件则 reduce 会生效:

    • 在  GTK/Gnome 中,可以通过 GNOME Tweaks (在“通用”或“外观”菜单中,取决于具体版本) 的配置,设置 gtk-enable-animations 的值为 false。 diff --git a/files/zh-cn/web/css/@media/width/index.html b/files/zh-cn/web/css/@media/width/index.html index 79d99ef1851509..388c8e419ec6d4 100644 --- a/files/zh-cn/web/css/@media/width/index.html +++ b/files/zh-cn/web/css/@media/width/index.html @@ -11,17 +11,17 @@ ---
      {{cssref}}
      -

      可以使用width CSS {{cssxref("@media")}} 基于{{glossary("viewport")}}宽度(或页面框,用于paged media)应用样式。

      +

      可以使用width CSS {{cssxref("@media")}} 基于{{glossary("viewport")}}宽度 (或页面框,用于paged media) 应用样式。

      语法

      -

      width特性被指定为{{cssxref("<length>")}},表示viewport宽度的值。这是一个范围特性,也就是说,您也可以使用前缀min-widthmax-width分别查询最小值和最大值。

      +

      width特性被指定为{{cssxref("<length>")}},表示 viewport 宽度的值。这是一个范围特性,也就是说,您也可以使用前缀min-widthmax-width分别查询最小值和最大值。

      例子

      HTML

      -
      <div>改变viewport的宽度的同时,观察这个元素的变化。</div>
      +
      <div>改变 viewport 的宽度的同时,观察这个元素的变化。</div>

      CSS

      diff --git a/files/zh-cn/web/css/@namespace/index.html b/files/zh-cn/web/css/@namespace/index.html index ec43123e85365b..28e2ae1a162cc1 100644 --- a/files/zh-cn/web/css/@namespace/index.html +++ b/files/zh-cn/web/css/@namespace/index.html @@ -10,18 +10,18 @@

      概述

      -

      @namespace 是用来定义使用在CSS样式表中的XML命名空间的@规则。定义的命名空间可以把通配、元素和属性选择器限制在指定命名空间里的元素。@namespace规则通常在处理包含多个namespaces的文档时才有用,比如HTML5里内联的SVG、MathML或者混合多个词汇表的XML。

      +

      @namespace 是用来定义使用在 CSS 样式表中的 XML 命名空间的 @规则。定义的命名空间可以把通配、元素和属性选择器限制在指定命名空间里的元素。@namespace规则通常在处理包含多个 namespaces 的文档时才有用,比如 HTML5 里内联的 SVG、MathML 或者混合多个词汇表的 XML。

      -

      任何 @namespace 规则都必须在所有的 @charset@import 规则之后, 并且在样式表中,位于其他任何 style declarations 之前。

      +

      任何 @namespace 规则都必须在所有的 @charset@import 规则之后,并且在样式表中,位于其他任何 style declarations 之前。

      -

      @namespace 可以用来定义默认命名空间。当定义过默认命名空间后, 所有的通配选择器和类型选择器(但不包括属性选择器,详情看下面的note)都只应用在这个命名空间的元素中。

      +

      @namespace 可以用来定义默认命名空间。当定义过默认命名空间后,所有的通配选择器和类型选择器(但不包括属性选择器,详情看下面的 note)都只应用在这个命名空间的元素中。

      @namespace 规则也可以用于定义命名空间前缀。当一个通配、类型、属性选择器前面有命名空间前缀修饰时,这个选择器将只匹配那些命名空间与 元素名或属性匹配 的元素。

      -

      HTML5 中,已知的 foreign elements(“外语元素,比如SVG和math命名空间中的元素”)将被自动加上命名空间。这意味着即使文档中没有任何xmlns属性,HTML元素也将表现的如同他们在XHTML命名空间内 (http://www.w3.org/1999/xhtml)一样,而 <svg><math> 元素则将被加上对应的命名空间 (http://www.w3.org/2000/svghttp://www.w3.org/1998/Math/MathML).

      +

      HTML5 中,已知的 foreign elements(“外语元素,比如 SVG 和 math 命名空间中的元素”) 将被自动加上命名空间。这意味着即使文档中没有任何 xmlns 属性,HTML 元素也将表现的如同他们在 XHTML 命名空间内 (http://www.w3.org/1999/xhtml) 一样,而 <svg><math> 元素则将被加上对应的命名空间 (http://www.w3.org/2000/svghttp://www.w3.org/1998/Math/MathML).

      -

      Note: 在 XML中,除非前缀直接定义在了一个属性上(例如:xlink:href),这个属性就不会有命名空间。换句话说,属性将不会继承其所在元素的命名空间,为了符合这个行为,CSS中的默认命名空间不会加到属性选择器中

      +

      Note: 在 XML 中,除非前缀直接定义在了一个属性上(例如:xlink:href),这个属性就不会有命名空间。换句话说,属性将不会继承其所在元素的命名空间,为了符合这个行为,CSS 中的默认命名空间不会加到属性选择器中

      语法

      @@ -43,7 +43,7 @@

      示例

      @namespace url(http://www.w3.org/1999/xhtml);
       @namespace svg url(http://www.w3.org/2000/svg);
       
      -/* 匹配所有的XHTML <a> 元素, 因为 XHTML 是默认无前缀命名空间 */
      +/* 匹配所有的 XHTML <a> 元素,因为 XHTML 是默认无前缀命名空间 */
       a {}
       
       /* 匹配所有的 SVG <a> 元素 */
      diff --git a/files/zh-cn/web/css/@page/index.html b/files/zh-cn/web/css/@page/index.html
      index 31ee00948e3bcc..a0d61b5cc2e8c8 100644
      --- a/files/zh-cn/web/css/@page/index.html
      +++ b/files/zh-cn/web/css/@page/index.html
      @@ -12,7 +12,7 @@
       ---
       
      {{CSSRef}}
      -

      @page 规则用于在打印文档时修改某些CSS属性。你不能用@page规则来修改所有的CSS属性,而是只能修改margin,orphans,widow 和 page breaks of the document。对其他属性的修改是无效的。

      +

      @page 规则用于在打印文档时修改某些 CSS 属性。你不能用 @page 规则来修改所有的 CSS 属性,而是只能修改 margin,orphans,widow 和 page breaks of the document。对其他属性的修改是无效的。

      @page {
         margin: 1cm;
      diff --git a/files/zh-cn/web/css/@property/index.html b/files/zh-cn/web/css/@property/index.html
      index f1eaf18521f5f0..a20aaf279504fc 100644
      --- a/files/zh-cn/web/css/@property/index.html
      +++ b/files/zh-cn/web/css/@property/index.html
      @@ -11,9 +11,9 @@
       ---
       
      {{CSSRef}}{{SeeCompatTable}}
      -

      @property CSS {{cssxref("at-rule")}}是CSS Houdini API的一部分, 它允许开发者显式地定义他们的{{cssxref('--*', 'CSS自定义属性')}}, 允许进行属性类型检查、设定默认值以及定义该自定义属性是否可以被继承。

      +

      @property CSS {{cssxref("at-rule")}}是CSS Houdini API 的一部分,它允许开发者显式地定义他们的{{cssxref('--*', 'CSS 自定义属性')}}, 允许进行属性类型检查、设定默认值以及定义该自定义属性是否可以被继承。

      -

      @property 规则提供了一个直接在样式表中注册自定义属性的方式,而无需运行任何JS代码。有效的 @property 规则会注册一个自定义属性, 就像 {{domxref('CSS.registerProperty')}} 函数被使用同样的参数调用了一样。

      +

      @property 规则提供了一个直接在样式表中注册自定义属性的方式,而无需运行任何 JS 代码。有效的 @property 规则会注册一个自定义属性,就像 {{domxref('CSS.registerProperty')}} 函数被使用同样的参数调用了一样。

      Syntax(语法描述符)

      @@ -23,9 +23,9 @@

      Syntax(语法描述符)

      initial-value: #c0ffee; }
      -

      一个有效的 @property 规则代表一项自定义属性的注册,使用自定义属性名作为规则内代码序列的序部。

      +

      一个有效的 @property 规则代表一项自定义属性的注册,使用自定义属性名作为规则内代码序列的序部。

      -

      @property 规则中 syntaxinherits 描述符是必需的; 如果其中任何一项缺失, 整条规则都将失效并且会被忽略。 initial-value 描述符仅在syntax描述符为通用syntax定义时是可选的,否则initial-value也是必需的——如果此时该描述符缺失,整条规则都将失效且被忽略。

      +

      @property 规则中 syntaxinherits 描述符是必需的; 如果其中任何一项缺失,整条规则都将失效并且会被忽略。 initial-value 描述符仅在 syntax 描述符为通用 syntax 定义时是可选的,否则initial-value也是必需的——如果此时该描述符缺失,整条规则都将失效且被忽略。

      未知的描述符自身都是无效的,且会被忽略。但是不会造成整条@property规则的失效。

      @@ -42,7 +42,7 @@

      实例

      }
      -

      使用 JavaScript中的 {{domxref('CSS.registerProperty')}}函数:

      +

      使用 JavaScript 中的 {{domxref('CSS.registerProperty')}}函数:

      window.CSS.registerProperty({
         name: '--my-color',
      @@ -68,7 +68,7 @@ 

      规范

      {{SpecName('CSS Properties and Values API', '#at-property-rule')}} {{Spec2('CSS Properties and Values API')}} - 初始定义. + 初始定义。 @@ -80,7 +80,7 @@

      浏览器兼容性

      另见

      -

      使用 JavaScript中的 {{domxref('CSS.registerProperty')}}函数:

      +

      使用 JavaScript 中的 {{domxref('CSS.registerProperty')}}函数:

      window.CSS.registerProperty({
         name: '--my-color',
      @@ -79,7 +79,7 @@ 

      规范

      {{SpecName('CSS Properties and Values API', '#inherits-descriptor', 'inherits')}} {{Spec2('CSS Properties and Values API')}} - 初始定义. + 初始定义。 @@ -91,7 +91,7 @@

      浏览器兼容性

      另见

        -
      • CSS属性与值 API
      • +
      • CSS 属性与值 API
      • CSS 绘图 API
      • CSS 类型对象模型
      • CSS Houdini
      • diff --git a/files/zh-cn/web/css/@property/initial-value/index.html b/files/zh-cn/web/css/@property/initial-value/index.html index 1cf88f44fe819b..c3242cbcee3a0e 100644 --- a/files/zh-cn/web/css/@property/initial-value/index.html +++ b/files/zh-cn/web/css/@property/initial-value/index.html @@ -11,9 +11,9 @@
        {{CSSRef}}{{SeeCompatTable}}
        -

        initial-value CSS描述符在使用{{cssxref("@property")}} {{cssxref("at-rule")}}的时候是必需的,除非syntax属性接受了任何有效的token流。 它为属性设置初始值。

        +

        initial-value CSS描述符在使用{{cssxref("@property")}} {{cssxref("at-rule")}}的时候是必需的,除非 syntax 属性接受了任何有效的 token 流。 它为属性设置初始值。

        -

        被选定为initial-value的参数,依照syntax描述符定义,必须可以正确地解析。 因此,如果syntax描述符为<color>,那么初始值必须是一个有效的{{cssxref("color")}}值。

        +

        被选定为initial-value的参数,依照syntax描述符定义,必须可以正确地解析。 因此,如果syntax描述符为<color>,那么初始值必须是一个有效的{{cssxref("color")}}值。

        语法

        @@ -54,7 +54,7 @@

        实例

        }
      -

      使用 JavaScript中的 {{domxref('CSS.registerProperty')}}函数:

      +

      使用 JavaScript 中的 {{domxref('CSS.registerProperty')}}函数:

      window.CSS.registerProperty({
         name: '--my-color',
      @@ -80,7 +80,7 @@ 

      规范

      {{SpecName('CSS Properties and Values API', '#at-property-rule')}} {{Spec2('CSS Properties and Values API')}} - 初始定义. + 初始定义。 @@ -92,7 +92,7 @@

      浏览器兼容性

      另见

        -
      • CSS属性与值 API
      • +
      • CSS 属性与值 API
      • CSS 绘图 API
      • CSS 类型对象模型
      • CSS Houdini
      • diff --git a/files/zh-cn/web/css/@property/syntax/index.html b/files/zh-cn/web/css/@property/syntax/index.html index 9a520b8d62c84d..051d7b832d6f73 100644 --- a/files/zh-cn/web/css/@property/syntax/index.html +++ b/files/zh-cn/web/css/@property/syntax/index.html @@ -14,7 +14,7 @@

        Syntax

        -

        如下是所有的有效syntax字符串:

        +

        如下是所有的有效 syntax 字符串:

        syntax: '<color>'; /* 接收一个颜色值 */
         
        @@ -31,33 +31,33 @@ 

        取值

        "<length>"
        -
        任何有效的 {{cssxref("<length>")}} 值.
        +
        任何有效的 {{cssxref("<length>")}} 值。
        "<number>"
        -
        任何有效的 {{cssxref("<number>")}} 值.
        +
        任何有效的 {{cssxref("<number>")}} 值。
        "<percentage>"
        -
        任何有效的 {{cssxref("<percentage>")}} 值.
        +
        任何有效的 {{cssxref("<percentage>")}} 值。
        "<length-percentage>"
        -
        任何有效的 {{cssxref("<length-percentage>")}} 值.
        +
        任何有效的 {{cssxref("<length-percentage>")}} 值。
        "<color>"
        -
        任何有效的 {{cssxref("<color>")}} 值.
        +
        任何有效的 {{cssxref("<color>")}} 值。
        "<image>"
        -
        任何有效的 {{cssxref("<image>")}} 值.
        +
        任何有效的 {{cssxref("<image>")}} 值。
        "<url>"
        -
        任何有效的 {{cssxref("url()","url()")}} 值.
        +
        任何有效的 {{cssxref("url()","url()")}} 值。
        "<integer>"
        -
        任何有效的 {{cssxref("<integer>")}} 值.
        +
        任何有效的 {{cssxref("<integer>")}} 值。
        "<angle>"
        -
        任何有效的 {{cssxref("<angle>")}} 值.
        +
        任何有效的 {{cssxref("<angle>")}} 值。
        "<time>"
        -
        任何有效的 {{cssxref("<time>")}} 值.
        +
        任何有效的 {{cssxref("<time>")}} 值。
        "<resolution>"
        -
        任何有效的 {{cssxref("<resolution>")}} 值.
        +
        任何有效的 {{cssxref("<resolution>")}} 值。
        "<transform-function>"
        -
        任何有效的 {{cssxref("<transform-function>")}} 值.
        +
        任何有效的 {{cssxref("<transform-function>")}} 值。
        "<custom-ident>"
        -
        任何有效的 {{cssxref("<custom-ident>")}} 值.
        +
        任何有效的 {{cssxref("<custom-ident>")}} 值。
        "<transform-list>"
        -
        A list of valid {{cssxref("<transform-function>")}} 值.
        +
        A list of valid {{cssxref("<transform-function>")}} 值。

        标准定义

        @@ -81,7 +81,7 @@

        实例

        }
        -

        使用 JavaScript中的 {{domxref('CSS.registerProperty')}}函数:

        +

        使用 JavaScript 中的 {{domxref('CSS.registerProperty')}}函数:

        window.CSS.registerProperty({
           name: '--my-color',
        @@ -107,7 +107,7 @@ 

        规范

        {{SpecName('CSS Properties and 值 API', '#at-property-rule')}} {{Spec2('CSS Properties and 值 API')}} - 初始定义. + 初始定义。 @@ -119,7 +119,7 @@

        浏览器兼容性

        另见

          -
        • CSS属性与值 API
        • +
        • CSS 属性与值 API
        • CSS 绘图 API
        • CSS 类型对象模型
        • CSS Houdini
        • diff --git a/files/zh-cn/web/css/@supports/index.html b/files/zh-cn/web/css/@supports/index.html index 5efb6460be4353..860d78173218dd 100644 --- a/files/zh-cn/web/css/@supports/index.html +++ b/files/zh-cn/web/css/@supports/index.html @@ -12,7 +12,7 @@ ---
          {{CSSRef}}
          -

          @supports CSS at-rule 您可以指定依赖于浏览器中的一个或多个特定的CSS功能的支持声明。这被称为特性查询。该规则可以放在代码的顶层,也可以嵌套在任何其他条件组规则中

          +

          @supports CSS at-rule 您可以指定依赖于浏览器中的一个或多个特定的 CSS 功能的支持声明。这被称为特性查询。该规则可以放在代码的顶层,也可以嵌套在任何其他条件组规则中

          @supports (display: grid) {
             div {
          @@ -30,7 +30,7 @@
           
           

          语法

          -

          @supports at-rule 由一组样式声明和一条支持条件构成。支持条件由一条或多条使用 逻辑与(and)、逻辑或(or)、逻辑非(not)结合的名称-值对(name-value pair)组成。可以使用圆括号调整操作符的优先级。

          +

          @supports at-rule 由一组样式声明和一条支持条件构成。支持条件由一条或多条使用 逻辑与(and)、逻辑或(or)、逻辑非(not)结合的名称 - 值对(name-value pair)组成。可以使用圆括号调整操作符的优先级。

          声明语法

          @@ -44,7 +44,7 @@

          函数语法

          selector() {{Experimental_Inline}}

          -

          测试浏览器是否支持经过测试的选择器语法。如果浏览器支持子组合器,则以下示例返回true:

          +

          测试浏览器是否支持经过测试的选择器语法。如果浏览器支持子组合器,则以下示例返回 true:

          @supports selector(A > B) {}
          @@ -102,25 +102,25 @@

          示例

          检测是否支持指定的 CSS 属性

          @supports (animation-name: test) {
          -    … /* 如果支持不带前缀的animation-name,则下面指定的CSS会生效 */
          -    @keyframes { /* @supports是一个CSS条件组at-rule,它可以包含其他相关的at-rules */
          +    … /* 如果支持不带前缀的 animation-name,则下面指定的 CSS 会生效 */
          +    @keyframes { /* @supports 是一个 CSS 条件组 at-rule,它可以包含其他相关的 at-rules */
                 …
               }
           }
           
          -

          检测是否支持指定的CSS属性或者其带前缀版本

          +

          检测是否支持指定的 CSS 属性或者其带前缀版本

          @supports ( (perspective: 10px) or (-moz-perspective: 10px) or (-webkit-perspective: 10px) or
                       (-ms-perspective: 10px) or (-o-perspective: 10px) ) {
          -    … /* 如果支持不带前缀以及带前缀的perspective属性,则下面指定的CSS会生效 */
          +    … /* 如果支持不带前缀以及带前缀的 perspective 属性,则下面指定的 CSS 会生效 */
           }
           
          -

          检测是否不支持指定的CSS属性

          +

          检测是否不支持指定的 CSS 属性

          @supports ( not ((text-align-last:justify) or (-moz-text-align-last:justify) ){
          -    … /* 这里的CSS代码用来模拟text-align-last:justify */
          +    … /* 这里的 CSS 代码用来模拟 text-align-last:justify */
           }

          测试是否支持自定义属性

          @@ -150,7 +150,7 @@

          +

           @viewport 规则让我们可以对文档的大小进行设置 {{glossary("viewport")}} 。这个特性主要被用于移动设备,但是也可以用在支持类似“固定到边缘”等特性的桌面浏览器,如微软的 Edge。

          按百分比计算尺寸的时候,就是参照的初始视口(viewport)。初始视口指的是任何用户代理和样式对它进行修改之前的视口。桌面浏览器如果不是全屏模式的话,一般是基于窗口大小。

          @@ -26,25 +26,25 @@

          语法

          -

          @规则包含一组包含在CSS代码块中的嵌套的 {{glossary("descriptor (CSS)", "descriptor")}}。

          +

          @规则包含一组包含在 CSS 代码块中的嵌套的 {{glossary("descriptor (CSS)", "descriptor")}}。

          -

          缩放因子1.0 或者 100% 表示不缩放,大于1表示放大,小于1表示缩小。

          +

          缩放因子1.0 或者 100% 表示不缩放,大于 1 表示放大,小于 1 表示缩小。

          描述符

          -

          目前,大多数浏览器对 @viewport 的支持很差,Internet Explorer和Edge对其支持较好。但即使在这些浏览器中,也只有少量的描述符可用。如果浏览器不支持 @viewport,浏览器会忽略 @viewport 以及任何和其相关的描述符。

          +

          目前,大多数浏览器对 @viewport 的支持很差,Internet Explorer 和 Edge 对其支持较好。但即使在这些浏览器中,也只有少量的描述符可用。如果浏览器不支持 @viewport,浏览器会忽略 @viewport 以及任何和其相关的描述符。

          min-width
          -
          设置viewport的最小宽度
          +
          设置 viewport 的最小宽度
          max-width
          -
          设置viewport的最大宽度
          +
          设置 viewport 的最大宽度
          width
          同时设置 min-widthmax-width
          min-height
          -
          设置viewport的最小高度
          +
          设置 viewport 的最小高度
          max-height
          -
          设置viewport的最大高度
          +
          设置 viewport 的最大高度
          height
          同时设置 min-heightmax-height
          zoom
          From f311d28df233b10c21f2cadff6976429adfb1c94 Mon Sep 17 00:00:00 2001 From: A1lo Date: Sun, 29 May 2022 08:48:08 +0800 Subject: [PATCH 2/3] Apply suggestions from code review --- files/zh-cn/web/css/@layer/index.md | 2 +- files/zh-cn/web/css/@media/aspect-ratio/index.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/files/zh-cn/web/css/@layer/index.md b/files/zh-cn/web/css/@layer/index.md index 57c4179bed1ee5..8cf2b1a031be98 100644 --- a/files/zh-cn/web/css/@layer/index.md +++ b/files/zh-cn/web/css/@layer/index.md @@ -58,7 +58,7 @@ browser-compat: css.at-rules.layer 即使 `utilities` 层中规则的 _优先级低于_ `theme` 层中的,该规则仍会被应用。一旦级联层顺序建立之后,优先级和出现顺序都会被忽略。这将使创建 CSS 选择器变得更加简单,因为你不需要确保每一个选择器都有足够高的优先级来覆盖其他冲突的规则,你只需要确保它们出现在一个顺序更靠后的级联层中。 -> **注**:在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加 CSS 规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 +> **备注**:在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加 CSS 规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 其他不属于任何一级联层的样式将被集中到同一匿名层,并置于所有层的后部,这意味着任何在层外声明的样式都会覆盖在层内声明的样式。 diff --git a/files/zh-cn/web/css/@media/aspect-ratio/index.html b/files/zh-cn/web/css/@media/aspect-ratio/index.html index e093079f1e3c47..872cca87258321 100644 --- a/files/zh-cn/web/css/@media/aspect-ratio/index.html +++ b/files/zh-cn/web/css/@media/aspect-ratio/index.html @@ -13,7 +13,7 @@

          语法

          例子

          -

          下面的例子包含一个 {{htmlElement("iframe")}} ,拥有它自身的 viewport。调整的<iframe>宽高来观察aspect-ratio的变化。

          +

          下面的例子包含一个 {{htmlElement("iframe")}},拥有它自身的 viewport。调整的 <iframe> 宽高来观察 aspect-ratio 的变化。

          HTML

          From 182763325aef96aaf0fe03335e72f8b72b83994c Mon Sep 17 00:00:00 2001 From: A1lo Date: Sun, 29 May 2022 08:51:45 +0800 Subject: [PATCH 3/3] Update files/zh-cn/web/css/@layer/index.md --- files/zh-cn/web/css/@layer/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/zh-cn/web/css/@layer/index.md b/files/zh-cn/web/css/@layer/index.md index 8cf2b1a031be98..d9339793978702 100644 --- a/files/zh-cn/web/css/@layer/index.md +++ b/files/zh-cn/web/css/@layer/index.md @@ -58,7 +58,7 @@ browser-compat: css.at-rules.layer 即使 `utilities` 层中规则的 _优先级低于_ `theme` 层中的,该规则仍会被应用。一旦级联层顺序建立之后,优先级和出现顺序都会被忽略。这将使创建 CSS 选择器变得更加简单,因为你不需要确保每一个选择器都有足够高的优先级来覆盖其他冲突的规则,你只需要确保它们出现在一个顺序更靠后的级联层中。 -> **备注**:在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加 CSS 规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 +> **备注:** 在已经声明级联层的名字后,它们的顺序随即被确立,你可以重复声明某级联层的名字来向其添加 CSS 规则。这些样式将被附加到该层的末尾,且级联层之间的顺序不会改变。 其他不属于任何一级联层的样式将被集中到同一匿名层,并置于所有层的后部,这意味着任何在层外声明的样式都会覆盖在层内声明的样式。