- 对于绝对定位的元素，元素下外边距边界与其包含块下边界之间的偏移。
- 对于相对定位定位的元素，元素的下边界离开其正常位置的偏移。 @@ -51,9 +51,9 @@
- {{cssxref("<percentage>")}}
- 代表元素包含块的高度的百分比 {{cssxref("<percentage>")}}。
auto
- - 这个关键字表示:
+
- 这个关键字表示：
diff --git a/files/zh-cn/web/css/touch-action/index.html b/files/zh-cn/web/css/touch-action/index.html index 8b1ecbfff6e21c..630aad7d2f1ce1 100644 --- a/files/zh-cn/web/css/touch-action/index.html +++ b/files/zh-cn/web/css/touch-action/index.html @@ -13,7 +13,7 @@ ----
-
- 对于绝对定位元素，元素将忽略此属性已{{ Cssxref("bottom") }}属性为准，如果此时设置
height: auto，将基于内容需要的高度设置高度；如果bottom也为auto的话，元素的垂直位置就是它假如作为静态(即static)元素时该在的位置。
+ - 对于绝对定位元素，元素将忽略此属性已{{ Cssxref("bottom") }}属性为准，如果此时设置
height: auto，将基于内容需要的高度设置高度；如果bottom也为auto的话，元素的垂直位置就是它假如作为静态 (即 static) 元素时该在的位置。 - 对于相对定位元素，元素相对正常位置的偏移量将基于{{ Cssxref("bottom") }}属性；如果
bottom也为auto的话，元素将不会有偏移。
{{ CSSRef }}-CSS属性
+touch-action用于设置触摸屏用户如何操纵元素的区域(例如，浏览器内置的缩放功能)。CSS 属性
touch-action用于设置触摸屏用户如何操纵元素的区域 (例如，浏览器内置的缩放功能)。/* Keyword values */ touch-action: auto; @@ -35,13 +35,13 @@
{{cssinfo}}
-默认情况下，平移（滚动）和缩放手势由浏览器专门处理。 使用 {{domxref("Pointer_events")}} 的应用程序将在浏览器开始处理触摸手势时收到一个 pointercancel 事件。 通过明确指定浏览器应该处理哪些手势，应用程序可以在 pointermove 和 pointerup 监听器中为其余的手势提供自己的行为。 使用 {{domxref("Touch_events")}} 的应用程序通过调用 {{domxref("Event.preventDefault","preventDefault()")}} 禁用浏览器处理手势，但也应使用触摸操作确保浏览器在调用任何事件侦听器之前，了解应用程序的意图。
+默认情况下，平移（滚动）和缩放手势由浏览器专门处理。使用 {{domxref("Pointer_events")}} 的应用程序将在浏览器开始处理触摸手势时收到一个 pointercancel 事件。通过明确指定浏览器应该处理哪些手势，应用程序可以在 pointermove 和 pointerup 监听器中为其余的手势提供自己的行为。使用 {{domxref("Touch_events")}} 的应用程序通过调用 {{domxref("Event.preventDefault","preventDefault()")}} 禁用浏览器处理手势，但也应使用触摸操作确保浏览器在调用任何事件侦听器之前，了解应用程序的意图。
-当手势开始时，浏览器与触摸的元素及其所有祖先的触摸动作值相交直到一个实现手势（换句话说，第一个包含滚动元素）的触摸动作值。 这意味着在实践中，触摸动作通常仅适用于具有某些自定义行为的单个元素，而无需在该元素的任何后代上明确指定触摸动作。 手势开始之后，触摸动作值的更改将不会对当前手势的行为产生任何影响。
+当手势开始时，浏览器与触摸的元素及其所有祖先的触摸动作值相交直到一个实现手势（换句话说，第一个包含滚动元素）的触摸动作值。这意味着在实践中，触摸动作通常仅适用于具有某些自定义行为的单个元素，而无需在该元素的任何后代上明确指定触摸动作。手势开始之后，触摸动作值的更改将不会对当前手势的行为产生任何影响。
语法
-touch-action 属性可以被指定为:
+touch-action 属性可以被指定为：
- 任何一个关键字
auto、none、manipulation，或
@@ -52,7 +52,7 @@ auto
- - 当触控事件发生在元素上时，由浏览器来决定进行哪些操作，比如对viewport进行平滑、缩放等。 +
- 当触控事件发生在元素上时，由浏览器来决定进行哪些操作，比如对 viewport 进行平滑、缩放等。
none- 当触控事件发生在元素上时，不进行任何操作。
pan-x
@@ -60,11 +60,11 @@ pan-y- 启用单指垂直平移手势。可以与 pan-x 、pan-left 、pan-right 和／或 pinch-zoom 组合使用。
manipulation
- - 浏览器只允许进行滚动和持续缩放操作。任何其它被auto值支持的行为不被支持。启用平移和缩小缩放手势，但禁用其他非标准手势，例如双击以进行缩放。 禁用双击可缩放功能可减少浏览器在用户点击屏幕时延迟生成点击事件的需要。 这是“pan-x pan-y pinch-zoom”（为了兼容性本身仍然有效）的别名。 +
- 浏览器只允许进行滚动和持续缩放操作。任何其它被 auto 值支持的行为不被支持。启用平移和缩小缩放手势，但禁用其他非标准手势，例如双击以进行缩放。禁用双击可缩放功能可减少浏览器在用户点击屏幕时延迟生成点击事件的需要。这是“pan-x pan-y pinch-zoom”（为了兼容性本身仍然有效）的别名。
pan-left,pan-right,pan-up,pan-down{{experimental_inline}}
- - 启用以指定方向滚动开始的单指手势。 一旦滚动开始，方向可能仍然相反。 请注意，滚动“向上”（pan-up）意味着用户正在将其手指向下拖动到屏幕表面上，同样 pan-left 表示用户将其手指向右拖动。 多个方向可以组合，除非有更简单的表示（例如，“pan-left pan-right”无效，因为“pan-x”更简单，而“pan-left pan-down”有效）。 +
- 启用以指定方向滚动开始的单指手势。一旦滚动开始，方向可能仍然相反。请注意，滚动“向上”（pan-up）意味着用户正在将其手指向下拖动到屏幕表面上，同样 pan-left 表示用户将其手指向右拖动。多个方向可以组合，除非有更简单的表示（例如，“pan-left pan-right”无效，因为“pan-x”更简单，而“pan-left pan-down”有效）。
pinch-zoom
- - 启用多手指平移和缩放页面。 这可以与任何平移值组合。 +
- 启用多手指平移和缩放页面。这可以与任何平移值组合。
border-box
- - border box是用作引用框,一个表格（table）的border-box是table包装盒的边框，而不是表的边框。 +
- border box 是用作引用框，一个表格（table）的 border-box 是 table 包装盒的边框，而不是表的边框。
fill-box- Uses the object bounding box as reference box.
view-box
diff --git a/files/zh-cn/web/css/transform-function/index.html b/files/zh-cn/web/css/transform-function/index.html
index 2c75239912e9a9..8b2bd816c00907 100644
--- a/files/zh-cn/web/css/transform-function/index.html
+++ b/files/zh-cn/web/css/transform-function/index.html
@@ -25,7 +25,7 @@ - l -
- 该参数是一个 {{cssxref("<length>")}} 给定从用户（显示屏）到 z = 0 平面的距离。 它用于将透视图转换应用于元素。 如果它是 0 或负值，则不应用透视变换。 +
- 该参数是一个 {{cssxref("<length>")}} 给定从用户（显示屏）到 z = 0 平面的距离。它用于将透视图转换应用于元素。如果它是 0 或负值，则不应用透视变换。
- x -
- 该参数为 {{cssxref("<number>")}} 类型值， 描述旋转轴向量的 x 坐标 。 +
- 该参数为 {{cssxref("<number>")}} 类型值，描述旋转轴向量的 x 坐标。
- y
- 该参数为 {{cssxref("<number>")}} 类型值，描述旋转轴向量的 y 坐标。
- z
- 该参数为 {{cssxref("<number>")}} 类型值，描述旋转轴向量的 z 坐标。
- a -
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度 。 正角度表示顺时针旋转，负角度表示逆时针旋转 。 +
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度。正角度表示顺时针旋转，负角度表示逆时针旋转。
- a -
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度， 正角表示顺时针旋转，负角表示逆时针旋转。 +
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度，正角表示顺时针旋转，负角表示逆时针旋转。
- a -
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度， 正角表示顺时针旋转，负角表示逆时针旋转。 +
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度，正角表示顺时针旋转，负角表示逆时针旋转。
- a -
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度， 正角表示顺时针旋转，负角表示逆时针旋转。 +
- 该参数为 {{ cssxref("<angle>") }} 代表旋转的角度，正角表示顺时针旋转，负角表示逆时针旋转。
- sx -
- 该参数为 {{cssxref("<number>")}} 类型值， 代表缩放矢量的横坐标。 +
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的横坐标。
- sy -
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的纵坐标 。 如果不存在，则其默认值为 sx，从而导致保持元素形状进行均匀缩放。 +
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的纵坐标。如果不存在，则其默认值为 sx，从而导致保持元素形状进行均匀缩放。
- sx -
- 该参数为 {{cssxref("<number>")}} 类型值， 代表缩放矢量的横坐标。 +
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的横坐标。
- sy -
- 该参数为 {{cssxref("<number>")}} 类型值， 代表缩放矢量的纵坐标。 +
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的纵坐标。
- sz -
- 该参数为 {{cssxref("<number>")}} 类型值， 代表缩放矢量的 z 轴坐标。 +
- 该参数为 {{cssxref("<number>")}} 类型值，代表缩放矢量的 z 轴坐标。
- s -
- 该参数为 {{cssxref("<number>")}} 类型值， 表示在元素的每个点的横坐标上应用的缩放因子。 +
- 该参数为 {{cssxref("<number>")}} 类型值，表示在元素的每个点的横坐标上应用的缩放因子。
- ax -
- 该参数为一个角度 {{ cssxref("<angle>") }} ， 表示用于沿着横坐标扭曲元素的角度 。 +
- 该参数为一个角度 {{ cssxref("<angle>") }} ，表示用于沿着横坐标扭曲元素的角度。
- ay -
- 该参数为一个角度 {{ cssxref("<angle>") }} ， 表示用于沿纵坐标扭曲元素的角度 。 +
- 该参数为一个角度 {{ cssxref("<angle>") }} ，表示用于沿纵坐标扭曲元素的角度。
- a -
- 该参数为一个角度 {{ cssxref("<angle>") }} ， 表示用于沿着横坐标扭曲元素的角度。 +
- 该参数为一个角度 {{ cssxref("<angle>") }} ，表示用于沿着横坐标扭曲元素的角度。
- tx
- 该参数为 {{cssxref("<length>")}} ，表示要移动矢量的横坐标。
- ty -
- 该参数为 {{cssxref("<length>")}} ，表示要移动矢量的纵坐标。 如果不写则默认为零，例如
translate(2)表示translate(2, 0)。
+ - 该参数为 {{cssxref("<length>")}} ，表示要移动矢量的纵坐标。如果不写则默认为零，例如
translate(2)表示translate(2, 0)。 - ty
- 该参数为 {{cssxref("<length>")}} ，代表移动矢量的纵坐标。
- tz -
- 该参数为 {{cssxref("<length>")}} 代表移动矢量的 z 轴坐标。 该值不能使用百分比 {{cssxref("<percentage>")}} ；如果使用会被认为是无效属性。 +
- 该参数为 {{cssxref("<length>")}} 代表移动矢量的 z 轴坐标。该值不能使用百分比 {{cssxref("<percentage>")}} ；如果使用会被认为是无效属性。
- l -
- 这个{{cssxref("<length>")}} 得到的是距离 0 坐标的距离。被用作提供一个透视渐变属性给某个元素. 如果这个值是 0 或者不合法的值，将不会产生透视的变化。 +
- 这个{{cssxref("<length>")}} 得到的是距离 0 坐标的距离。被用作提供一个透视渐变属性给某个元素。如果这个值是 0 或者不合法的值，将不会产生透视的变化。
- a -
- 是一种{{ cssxref("<angle>") }}，表示旋转的角度。 正角度表示了顺时针的旋转，负角度表示逆时针的旋转。 +
- 是一种{{ cssxref("<angle>") }}，表示旋转的角度。正角度表示了顺时针的旋转，负角度表示逆时针的旋转。
- x
- {{cssxref("<number>")}} 类型，可以是 0 到 1 之间的数值，表示旋转轴 X 坐标方向的矢量。
- y -
- {{cssxref("<number>")}} 类型， 可以是 0 到 1 之间的数值，表示旋转轴 Y 坐标方向的矢量。 +
- {{cssxref("<number>")}} 类型，可以是 0 到 1 之间的数值，表示旋转轴 Y 坐标方向的矢量。
- z -
- {{cssxref("<number>")}} 类型， 可以是 0 到 1 之间的数值，表示旋转轴 Z 坐标方向的矢量。 +
- {{cssxref("<number>")}} 类型，可以是 0 到 1 之间的数值，表示旋转轴 Z 坐标方向的矢量。
- a
- {{ cssxref("<angle>") }} 类型，表示旋转角度。正的角度值表示顺时针旋转，负值表示逆时针旋转。 diff --git a/files/zh-cn/web/css/transform-function/scale/index.html b/files/zh-cn/web/css/transform-function/scale/index.html index 60163259e91be6..d7ddd9898cb419 100644 --- a/files/zh-cn/web/css/transform-function/scale/index.html +++ b/files/zh-cn/web/css/transform-function/scale/index.html @@ -30,7 +30,7 @@
- sx
- {{cssxref("<number>")}}，表示缩放向量的横坐标。
- sy -
- {{cssxref("<number>")}} ，表示缩放向量的纵坐标。如果未设置，则他的默认值被设置为 sx。 从而使得元素在保持原有形状下均等缩放 +
- {{cssxref("<number>")}} ，表示缩放向量的纵坐标。如果未设置，则他的默认值被设置为 sx。从而使得元素在保持原有形状下均等缩放
- 单个
<length-percentage>作为参数
- - 该值是 {{cssxref("<length>")}} 或者 {{cssxref("<percentage>")}} 代表翻译向量的横坐标 (horizontal, x-coordinate) . 而向量的纵坐标 (vertical, y-coordinate) 会被默认为
0. 例如，translate(2)等价于translate(2, 0)。 里面还可以填百分比值，百分比值是指 {{cssxref("transform-box")}} 属性定义的参考框的宽度。
+ - 该值是 {{cssxref("<length>")}} 或者 {{cssxref("<percentage>")}} 代表翻译向量的横坐标 (horizontal, x-coordinate) . 而向量的纵坐标 (vertical, y-coordinate) 会被默认为
0. 例如，translate(2)等价于translate(2, 0)。里面还可以填百分比值，百分比值是指 {{cssxref("transform-box")}} 属性定义的参考框的宽度。 - 参数是两个
<length-percentage>构成
- - 此值描述两个 {{cssxref("<length>")}} 或 {{cssxref("<percentage>")}} 值，分别代表翻译的横坐标 (x-coordinate) 和纵坐标 (y-coordinate) 向量。 百分比作为第一个值表示宽度，第二个部分表示由 {{cssxref("transform-box")}} 属性定义的参考框的高度。 +
- 此值描述两个 {{cssxref("<length>")}} 或 {{cssxref("<percentage>")}} 值，分别代表翻译的横坐标 (x-coordinate) 和纵坐标 (y-coordinate) 向量。百分比作为第一个值表示宽度，第二个部分表示由 {{cssxref("transform-box")}} 属性定义的参考框的高度。
- 三个值：
- 前两个值和只有两个值时的用法相同。 -
- 第三个值必须是{{cssxref("<length>")}}。它始终代表Z轴偏移量。 +
- 第三个值必须是{{cssxref("<length>")}}。它始终代表 Z 轴偏移量。
@@ -93,7 +93,7 @@ - y-offset-keyword
top，bottom或center中之一，定义相对应的变形中心偏移。- z-offset -
- 定义变形中心距离用户视线（z=0处）的{{cssxref("<length>")}}（不能是{{cssxref("<percentage>")}}）偏移值。 +
- 定义变形中心距离用户视线（z=0 处）的{{cssxref("<length>")}}（不能是{{cssxref("<percentage>")}}）偏移值。
- {{cssxref("<transform-function>")}} -
- 要应用的一个或多个CSS变换函数。 变换函数按从左到右的顺序相乘，这意味着复合变换按从右到左的顺序有效地应用。 +
- 要应用的一个或多个 CSS 变换函数。变换函数按从左到右的顺序相乘，这意味着复合变换按从右到左的顺序有效地应用。
none- 不应用任何变换。
<timing-function>
- - 通过{{ cssxref("transition-property") }}中定义被过渡属性，每个 {{cssxref("<timing-function>")}}的值代表与这个属性相对应的timing function. +
- 通过{{ cssxref("transition-property") }}中定义被过渡属性，每个 {{cssxref("<timing-function>")}}的值代表与这个属性相对应的 timing function.
- 零或一个值，表示转换应适用的属性。 这可能是以下任何一种： +
- 零或一个值，表示转换应适用的属性。这可能是以下任何一种：
- 关键字
none - 关键字
all
@@ -69,7 +69,7 @@ - 单个长度/百分比值 -
- 一个长度值或百分比，表示二维平移，与声明了 X 轴和 Y 轴的平移一样（此时省略的第二个值默认为0）。等同于在
translate()函数（2D 平移）中指定单个值。
+ - 一个长度值或百分比，表示二维平移，与声明了 X 轴和 Y 轴的平移一样（此时省略的第二个值默认为 0）。等同于在
translate()函数（2D 平移）中指定单个值。 - 两个长度/百分比值 -
- 两个长度值或百分比表示在二维上分别按照指定X轴和Y轴的值进行的平移。等同于在
translate()函数（2D 平移）中函数指定两个值。
+ - 两个长度值或百分比表示在二维上分别按照指定 X 轴和 Y 轴的值进行的平移。等同于在
translate()函数（2D 平移）中函数指定两个值。 - 三个长度/百分比值
- 三个长度值或百分比，表示分别指定 X 轴、Y 轴、Z 轴的值进行三维平移。等同于
translate3d()函数（3D 平移）。 none
diff --git a/files/zh-cn/web/css/tutorials/index.html b/files/zh-cn/web/css/tutorials/index.html
index b7ccee31e6513e..e8ec2247acc897 100644
--- a/files/zh-cn/web/css/tutorials/index.html
+++ b/files/zh-cn/web/css/tutorials/index.html
@@ -8,42 +8,42 @@
- Tutorials
translation_of: Web/CSS/Tutorials
---
-- 开始使用
- - 这篇教程完全面向新手。假如你还没写过一行css-这篇很适合你。这篇文章介绍了css的一些基础概念，引导你书写基本的css。 + 这篇教程完全面向新手。假如你还没写过一行 css-这篇很适合你。这篇文章介绍了 css 的一些基础概念，引导你书写基本的 css。
- 使用丰富多彩的背景
- - 背景是优美样式的基础。css允许你对每个容器设置不同的背景。这篇教程会讲述css与背景之间是如何相互影响，以及你如何得到想要的结果。 + 背景是优美样式的基础。css 允许你对每个容器设置不同的背景。这篇教程会讲述 css 与背景之间是如何相互影响，以及你如何得到想要的结果。
- 调整背景图片
- - CSS允许你改变元素背景图片的大小。这篇教程告诉你如何去实现。 + CSS 允许你改变元素背景图片的大小。这篇教程告诉你如何去实现。
- Media Queries媒体查询
- 当前存在各种不同尺寸的屏幕，不同种类的设备。当你要求你的页面在各大平台都获得一个满意的渲染效果时，媒体查询将是一块基石。
- - 弄清楚z-index + 弄清楚 z-index
- - 控制容器叠加层级是web开发者的一个基本需求。了解css的一些基础知识，z-index将会变得小菜一碟. + 控制容器叠加层级是 web 开发者的一个基本需求。了解 css 的一些基础知识，z-index 将会变得小菜一碟。
- CSS Counters
- - 对元素及页面计数对于CSS来讲是一项简单的事情。学习使用{{cssxref("counter-reset")}}, {{cssxref("counter-increment")}}, {{cssxref("counters", "counters()")}}, 及{{cssxref("counter", "counter()")}}. + 对元素及页面计数对于 CSS 来讲是一项简单的事情。学习使用{{cssxref("counter-reset")}}, {{cssxref("counter-increment")}}, {{cssxref("counters", "counters()")}}, 及{{cssxref("counter", "counter()")}}.
- CSS Animations
- - CSS3动画允许你通过 keyframes定义样式，之后在keyframes之间变换，来形成一个动画。 + CSS3 动画允许你通过 keyframes定义样式，之后在 keyframes 之间变换，来形成一个动画。
- CSS Transitions
-
@@ -51,19 +51,19 @@
CSS中级教程
- CSS Transforms
- - 变换可以通过坐标改变元素的位置，可以使用位移，旋转等定义元素在2D 或 3D 空间的状态. + 变换可以通过坐标改变元素的位置，可以使用位移，旋转等定义元素在 2D 或 3D 空间的状态。
- CSS Gradients
- - 渐变其实是图片，可以让一个颜色柔和的过渡到另一个颜色。CSS中有很多渐变方式:线性渐变或者径向渐变等.这篇教程会讲解怎么使用渐变。 + 渐变其实是图片，可以让一个颜色柔和的过渡到另一个颜色。CSS 中有很多渐变方式：线性渐变或者径向渐变等.这篇教程会讲解怎么使用渐变。
- CSS Multi-column layouts
- - CSS3引入了新的布局方式，可以让你简单的在元素中创建多列布局。尽管多列布局在很多设备上不常见，但多列布局在可打印页面或索引页中很有用。 + CSS3 引入了新的布局方式，可以让你简单的在元素中创建多列布局。尽管多列布局在很多设备上不常见，但多列布局在可打印页面或索引页中很有用。
- CSS Flexible boxes layouts
-
diff --git a/files/zh-cn/web/css/type_selectors/index.html b/files/zh-cn/web/css/type_selectors/index.html
index 2d72dee1562f9e..54433fa54e6ea7 100644
--- a/files/zh-cn/web/css/type_selectors/index.html
+++ b/files/zh-cn/web/css/type_selectors/index.html
@@ -10,7 +10,7 @@
概述
-CSS元素选择器(也称为类型选择器)通过node节点名称匹配元素. 因此,在单独使用时,寻找特定类型的元素时,元素选择器都会匹配该文档中所有此类型的元素.
+CSS 元素选择器 (也称为类型选择器) 通过 node 节点名称匹配元素。因此，在单独使用时，寻找特定类型的元素时，元素选择器都会匹配该文档中所有此类型的元素。
语法
@@ -35,8 +35,8 @@HTML
效果
-这里是由 span 包裹的一些文字.
+
- 这里是由 p 包裹的一些文字.这里是由 span 包裹的一些文字。
+ 这里是由 p 包裹的一些文字。规范
diff --git a/files/zh-cn/web/css/unicode-bidi/index.html b/files/zh-cn/web/css/unicode-bidi/index.html index 0ba9aa25d0e24a..7b911db3ad7db3 100644 --- a/files/zh-cn/web/css/unicode-bidi/index.html +++ b/files/zh-cn/web/css/unicode-bidi/index.html @@ -45,7 +45,7 @@值
isolate-override- 这个关键字将
isolate关键字的隔离行为应用于周围的内容，并将bidi-override关键字的覆盖行为应用于内部内容。 plaintext
- - 这个关键字在计算元素方向的时候，不考虑父元素的双向状态，也不考虑 {{cssxref("direction")}} 属性的值。它是使用 Unicode 双向算法的P2和P3规则计算的。
+- 这个关键字在计算元素方向的时候，不考虑父元素的双向状态，也不考虑 {{cssxref("direction")}} 属性的值。它是使用 Unicode 双向算法的 P2 和 P3 规则计算的。
这个值允许按照 Unicode 双向算法显示已经格式化的数据。 - 这个关键字在计算元素方向的时候，不考虑父元素的双向状态，也不考虑 {{cssxref("direction")}} 属性的值。它是使用 Unicode 双向算法的 P2 和 P3 规则计算的。
ns|*- 会匹配ns命名空间下的所有元素
@@ -28,7 +28,7 @@ - 使用{{cssxref("initial")}}将属性设置为其初始值。 -
- 使用{{cssxref("revert")}}将属性重置为user-agent样式表规定的值（或用户样式，如果存在）。 +
- 使用{{cssxref("revert")}}将属性重置为 user-agent 样式表规定的值（或用户样式，如果存在）。
- 使用{{cssxref("inherit")}}使元素的属性与其父元素相同。
- {{cssxref("all")}}属性允许您一次将所有属性重置为其初始，继承，恢复或未设置状态。
- background-position diff --git a/files/zh-cn/web/css/user-select/index.html b/files/zh-cn/web/css/user-select/index.html index d617a052517daf..0ece9ffa362222 100644 --- a/files/zh-cn/web/css/user-select/index.html +++ b/files/zh-cn/web/css/user-select/index.html @@ -51,7 +51,7 @@
none
- - 元素及其子元素的文本不可选中。 请注意这个{{domxref("Selection")}} 对象可以包含这些元素。 从Firefox 21开始，
none表现的像-moz-none，因此可以使用-moz-user-select: text在子元素上重新启用选择。
+ - 元素及其子元素的文本不可选中。请注意这个{{domxref("Selection")}} 对象可以包含这些元素。从 Firefox 21 开始，
none表现的像-moz-none，因此可以使用-moz-user-select: text在子元素上重新启用选择。 auto-
@@ -67,7 +67,7 @@auto的具体取值取决于一系列条件，具体如下：语法
text- 用户可以选择文本。
all
- - 在一个HTML编辑器中，当双击子元素或者上下文时，那么包含该子元素的最顶层元素也会被选中。 +
- 在一个 HTML 编辑器中，当双击子元素或者上下文时，那么包含该子元素的最顶层元素也会被选中。
contain- 允许在元素内选择；但是，选区将被限制在该元素的边界之内。
element{{non-standard_inline}}（IE 专有别名）
diff --git a/files/zh-cn/web/css/using_css_custom_properties/index.html b/files/zh-cn/web/css/using_css_custom_properties/index.html
index 8b6ac18ce57e71..f7918dd340bb47 100644
--- a/files/zh-cn/web/css/using_css_custom_properties/index.html
+++ b/files/zh-cn/web/css/using_css_custom_properties/index.html
@@ -1,5 +1,5 @@
---
-title: 使用CSS自定义属性（变量）
+title: 使用 CSS 自定义属性（变量）
slug: Web/CSS/Using_CSS_custom_properties
tags:
- ':root'
@@ -8,11 +8,11 @@
- variable
translation_of: Web/CSS/Using_CSS_custom_properties
---
-- 对于元素
class="one"：非法值，会变成自定义属性的默认值 bold因为它不允许出现。
-- <custom-property-name> 自定义属性名 -
- 在实际应用中它被定义为以两个破折号开始的任何有效标识符。 自定义属性仅供作者和用户使用; CSS 将永远不会给他们超出这里表达的意义。 +
- 在实际应用中它被定义为以两个破折号开始的任何有效标识符。自定义属性仅供作者和用户使用; CSS 将永远不会给他们超出这里表达的意义。
- <declaration-value> 声明值（后备值）
- 回退值被用来在自定义属性值无效的情况下保证函数有值。回退值可以包含任何字符，但是部分有特殊含义的字符除外，例如换行符、不匹配的右括号（如
)、]或}）、感叹号以及顶层分号（不被任何非var()的括号包裹的分号，例如var(--bg-color, --bs;color)是不合法的，而var(--bg-color, --value(bs;color))是合法的）。 - 使行内元素盒模型与其行内元素容器垂直对齐。例如，用于垂直对齐一行文本内的图片{{HTMLElement("img")}}： @@ -63,7 +63,7 @@
- 垂直对齐表格单元内容: +
- 垂直对齐表格单元内容：
baseline
- - 使元素的基线与父元素的基线对齐。HTML规范没有详细说明部分可替换元素的基线，如{{HTMLElement("textarea")}} ，这意味着这些元素使用此值的表现因浏览器而异。 +
- 使元素的基线与父元素的基线对齐。HTML 规范没有详细说明部分可替换元素的基线，如{{HTMLElement("textarea")}} ，这意味着这些元素使用此值的表现因浏览器而异。
sub- 使元素的基线与父元素的下标基线对齐。
super
@@ -148,7 +148,7 @@ text-bottom- 使元素的底部与父元素的字体底部对齐。
middle
- - 使元素的中部与父元素的基线加上父元素x-height（译注：x高度）的一半对齐。 +
- 使元素的中部与父元素的基线加上父元素 x-height（译注：x 高度）的一半对齐。
- {{cssxref("<length>")}}
- 使元素的基线对齐到父元素的基线之上的给定长度。可以是负数。
- {{cssxref("<percentage>")}} @@ -227,7 +227,7 @@
- 文档的 {{DOMxRef("Element.clientWidth")}} 是指一个文档使用 CSS pixels 单位表示的内部宽度, 包括其 padding (不包括 borders, margins 或垂直滚动条，如果有的话）。这就是 viewport 的宽度。 +
- 文档的 {{DOMxRef("Element.clientWidth")}} 是指一个文档使用 CSS pixels 单位表示的内部宽度，包括其 padding (不包括 borders, margins 或垂直滚动条，如果有的话）。这就是 viewport 的宽度。
- {{DOMxRef("Window.innerWidth")}} 是用 CSS pixels 单位表示的浏览器窗口 viewport 宽度，包括垂直滚动条，如果渲染了的话。
- {{DOMxRef("Window.outerWidth")}} 是指包括了浏览器外边框的窗口宽度。
- 盒子的尺寸：精确指定、由约束条件指定或没有指定 @@ -38,11 +38,11 @@
- 块：block，一个抽象的概念，一个块在文档流上占据一个独立的区域，块与块之间在垂直方向上按照顺序依次堆叠。
- 包含块：containing block，包含其他盒子的块称为包含块。 -
- 盒子：box，一个抽象的概念，由CSS引擎根据文档中的内容所创建，主要用于文档元素的定位、布局和格式化等用途。盒子与元素并不是一一对应的，有时多个元素会合并生成一个盒子，有时一个元素会生成多个盒子（如匿名盒子）。 +
- 盒子：box，一个抽象的概念，由 CSS 引擎根据文档中的内容所创建，主要用于文档元素的定位、布局和格式化等用途。盒子与元素并不是一一对应的，有时多个元素会合并生成一个盒子，有时一个元素会生成多个盒子（如匿名盒子）。
- 块级元素：block-level element，元素的
display为block、list-item、table时，该元素将成为块级元素。元素是否是块级元素仅是元素本身的属性，并不直接用于格式化上下文的创建或布局。 - 块级盒子：block-level box，由块级元素生成。一个块级元素至少会生成一个块级盒子，但也有可能生成多个（例如列表项元素）。 -
- 块盒子：block box，如果一个块级盒子同时也是一个块容器盒子（见下），则称其为块盒子。除具名块盒子之外，还有一类块盒子是匿名的，称为匿名块盒子（Anonymous block box），匿名盒子无法被CSS选择符选中。 -
- 块容器盒子：block container box或block containing box，块容器盒子侧重于当前盒子作为“容器”的这一角色，它不参与当前块的布局和定位，它所描述的仅仅是当前盒子与其后代之间的关系。换句话说，块容器盒子主要用于确定其子元素的定位、布局等。 +
- 块盒子：block box，如果一个块级盒子同时也是一个块容器盒子（见下），则称其为块盒子。除具名块盒子之外，还有一类块盒子是匿名的，称为匿名块盒子（Anonymous block box），匿名盒子无法被 CSS 选择符选中。 +
- 块容器盒子：block container box 或 block containing box，块容器盒子侧重于当前盒子作为“容器”的这一角色，它不参与当前块的布局和定位，它所描述的仅仅是当前盒子与其后代之间的关系。换句话说，块容器盒子主要用于确定其子元素的定位、布局等。
- 表格内容模型可能会创建一个表格包装器盒子和一个表格盒子，以及多个其他盒子如表格标题盒子等
- 多列内容模型可能会在容器盒子和内容之间创建多个列盒子 -
- 实验性的网格内容模型或flex-box内容模型同样会创建一些其他种类的盒子 +
- 实验性的网格内容模型或 flex-box 内容模型同样会创建一些其他种类的盒子
- 普通流：按照次序依次定位每个盒子 @@ -236,7 +236,7 @@
- {{ Cssxref("-webkit-box-sizing") }}
- {{ Cssxref("-epub-caption-side") }} -
normal
- - 连续的空白符会被合并，换行符会被当作空白符来处理。换行在填充「行框盒子(line boxes)」时是必要。 +
- 连续的空白符会被合并，换行符会被当作空白符来处理。换行在填充「行框盒子 (line boxes)」时是必要。
nowrap- 和 normal 一样，连续的空白符会被合并。但文本内的换行无效。
pre- 连续的空白符会被保留。在遇到换行符或者{{HTMLElement("br")}}元素时才会换行。
pre-wrap
- - 连续的空白符会被保留。在遇到换行符或者{{HTMLElement("br")}}元素，或者需要为了填充「行框盒子(line boxes)」时才会换行。 +
- 连续的空白符会被保留。在遇到换行符或者{{HTMLElement("br")}}元素，或者需要为了填充「行框盒子 (line boxes)」时才会换行。
pre-line
- - 连续的空白符会被合并。在遇到换行符或者{{HTMLElement("br")}}元素，或者需要为了填充「行框盒子(line boxes)」时会换行。 +
- 连续的空白符会被合并。在遇到换行符或者{{HTMLElement("br")}}元素，或者需要为了填充「行框盒子 (line boxes)」时会换行。
min-content{{ experimental_inline }}- 元素内容固有的最小宽度。
fit-content{{ experimental_inline }}
- - 取以下两种值中的较大值:
+
- 取以下两种值中的较大值：
- 固有的最小宽度
- 固有首选宽度（max-content）和可用宽度（available）两者中的较小值 diff --git a/files/zh-cn/web/css/will-change/index.html b/files/zh-cn/web/css/will-change/index.html index 92ac42652ffa54..0e98b33890c073 100644 --- a/files/zh-cn/web/css/will-change/index.html +++ b/files/zh-cn/web/css/will-change/index.html @@ -5,7 +5,7 @@ ---
normal- 使用默认的断行规则。
break-all
- - 对于non-CJK (CJK 指中文/日文/韩文) 文本，可在任意字符间断行。 +
- 对于 non-CJK (CJK 指中文/日文/韩文) 文本，可在任意字符间断行。
keep-all
- - CJK 文本不断行。 Non-CJK 文本表现同
normal。
+ - CJK 文本不断行。Non-CJK 文本表现同
normal。 break-word{{Deprecated_Inline}}- 他的效果是
word-break: normal和overflow-wrap: anywhere的合，不论 {{cssxref("overflow-wrap")}}的值是多少。
diff --git a/files/zh-cn/web/css/writing-mode/index.html b/files/zh-cn/web/css/writing-mode/index.html
index 1b6e91ffb8234c..585d7e132b8225 100644
--- a/files/zh-cn/web/css/writing-mode/index.html
+++ b/files/zh-cn/web/css/writing-mode/index.html
@@ -27,18 +27,18 @@ horizontal-tb
- - 对于左对齐(ltr)文本，内容从左到右水平流动。对于右对齐(rtr)文本，内容从右到左水平流动。下一水平行位于上一行下方。 +
- 对于左对齐 (ltr) 文本，内容从左到右水平流动。对于右对齐 (rtr) 文本，内容从右到左水平流动。下一水平行位于上一行下方。
vertical-rl
- - 对于左对齐(ltr)文本，内容从上到下垂直流动，下一垂直行位于上一行左侧。对于右对齐(rtr)文本，内容从下到上垂直流动，下一垂直行位于上一行右侧。 +
- 对于左对齐 (ltr) 文本，内容从上到下垂直流动，下一垂直行位于上一行左侧。对于右对齐 (rtr) 文本，内容从下到上垂直流动，下一垂直行位于上一行右侧。
vertical-lr
- - 对于左对齐(ltr)文本，内容从上到下垂直流动，下一垂直行位于上一行右侧。对于右对齐(rtr)文本，内容从下到上垂直流动，下一垂直行位于上一行左侧。 +
- 对于左对齐 (ltr) 文本，内容从上到下垂直流动，下一垂直行位于上一行右侧。对于右对齐 (rtr) 文本，内容从下到上垂直流动，下一垂直行位于上一行左侧。
sideways-rl{{experimental_inline}}
- - 对于左对齐(ltr)文本，内容从下到上垂直流动。对于右对齐(rtr)文本，内容从上到下垂直流动。所有字形（即使是垂直文本中的字形）都朝向右侧。 +
- 对于左对齐 (ltr) 文本，内容从下到上垂直流动。对于右对齐 (rtr) 文本，内容从上到下垂直流动。所有字形（即使是垂直文本中的字形）都朝向右侧。
sideways-lr{{experimental_inline}}
- - 对于左对齐(ltr)文本，内容从上到下垂直流动。对于右对齐(rtr)文本，内容从下到上垂直流动。所有字形（即使是垂直文本中的字形）都朝向左侧。 +
- 对于左对齐 (ltr) 文本，内容从上到下垂直流动。对于右对齐 (rtr) 文本，内容从下到上垂直流动。所有字形（即使是垂直文本中的字形）都朝向左侧。
lr{{deprecated_inline}}- 除 SVG1 文档外，已弃用。对于 CSS，请改用
horizontal-tb。 lr-tb{{deprecated_inline}}
@@ -57,7 +57,7 @@
{{ CSSRef() }}{{SeeCompatTable}}-CSS 属性
+will-change为web开发者提供了一种告知浏览器该元素会有哪些变化的方法，这样浏览器可以在元素属性真正发生变化之前提前做好对应的优化准备工作。 这种优化可以将一部分复杂的计算工作提前准备好，使页面的反应更为快速灵敏。CSS 属性
will-change为 web 开发者提供了一种告知浏览器该元素会有哪些变化的方法，这样浏览器可以在元素属性真正发生变化之前提前做好对应的优化准备工作。这种优化可以将一部分复杂的计算工作提前准备好，使页面的反应更为快速灵敏。用好这个属性并不是很容易：
diff --git a/files/zh-cn/web/css/word-break/index.html b/files/zh-cn/web/css/word-break/index.html index 07e862e86aa9cb..60459c916ba0d0 100644 --- a/files/zh-cn/web/css/word-break/index.html +++ b/files/zh-cn/web/css/word-break/index.html @@ -34,9 +34,9 @@值
Values
正式语法
示例
-该例子展现了所有writing-mode语法，以及不同语言的展示情况。
+该例子展现了所有 writing-mode 语法，以及不同语言的展示情况。
HTML
diff --git a/files/zh-cn/web/css/z-index/index.html b/files/zh-cn/web/css/z-index/index.html index 7ef2adc6c2756e..22bcdc4d65fd64 100644 --- a/files/zh-cn/web/css/z-index/index.html +++ b/files/zh-cn/web/css/z-index/index.html @@ -3,13 +3,13 @@ slug: Web/CSS/z-index tags: - CSS - - CSS定位 - - CSS属性 + - CSS 定位 + - CSS 属性 translation_of: Web/CSS/z-index ---{{CSSRef}}-
+z-index属性设定了一个定位元素及其后代元素或 flex 项目的 z-order。 当元素之间重叠的时候， z-index 较大的元素会覆盖较小的元素在上层进行显示。z-index属性设定了一个定位元素及其后代元素或 flex 项目的 z-order。当元素之间重叠的时候，z-index 较大的元素会覆盖较小的元素在上层进行显示。{{EmbedInteractiveExample("pages/css/z-index.html")}}
- 取以下两种值中的较大值：
标准语法
示例
-“使用 CSS 过渡” 一文中还包含了几个 CSS 过渡示例。
+“使用 CSS 过渡”一文中还包含了几个 CSS 过渡示例。
规范
diff --git a/files/zh-cn/web/css/translate/index.html b/files/zh-cn/web/css/translate/index.html index acfffc7ba928d4..8b2877e4cc2677 100644 --- a/files/zh-cn/web/css/translate/index.html +++ b/files/zh-cn/web/css/translate/index.html @@ -3,7 +3,7 @@ slug: Web/CSS/translate tags: - CSS - - CSS属性 + - CSS 属性 - Transforms - 参考 - 实验性 @@ -35,9 +35,9 @@值
学习CSS可能是一项令人望而生畏的事情。我们编写了很多的css教程来帮助你。有些教程完全面向新手，而其他文章展现了一些css的复杂特性，适合拥有丰富经验的开发者。
+学习 CSS 可能是一项令人望而生畏的事情。我们编写了很多的 css 教程来帮助你。有些教程完全面向新手，而其他文章展现了一些 css 的复杂特性，适合拥有丰富经验的开发者。
这个页面展现了这些文章，并且带有简短的描述。这些文章按照难度分组，因此你可以选择最适合你的。
-CSS初级教程
+CSS 初级教程
CSS中级教程
-CSS 2 (Level 1)标准放出后, CSS增加了很多新特性.有些特性比较独立，而且很酷，你只需要对css的基本概念有一些直观的了解就可以使用它们。
+CSS 中级教程
+CSS 2 (Level 1) 标准放出后，CSS 增加了很多新特性。有些特性比较独立，而且很酷，你只需要对 css 的基本概念有一些直观的了解就可以使用它们。
CSS高级教程
-CSS 也拥有一些特性来帮助你创建复杂的布局。虽然这特性可以使你用最简单的方式来达到布局效果,但对于那些没有太多经验的人来说，这些特性相当复杂。
+CSS 高级教程
+CSS 也拥有一些特性来帮助你创建复杂的布局。虽然这特性可以使你用最简单的方式来达到布局效果，但对于那些没有太多经验的人来说，这些特性相当复杂。
概述
-在CSS中,一个星号(
+*)就是一个通配选择器.它可以匹配任意类型的HTML元素.在配合其他简单选择器的时候,省略掉通配选择器会有同样的效果.比如,*.warning和.warning的效果完全相同.在 CSS 中，一个星号 (
-*) 就是一个通配选择器。它可以匹配任意类型的 HTML 元素。在配合其他简单选择器的时候，省略掉通配选择器会有同样的效果。比如，*.warning和.warning的效果完全相同。在CSS3中,星号(
+*)可以和命名空间组合使用:在 CSS3 中，星号 (
*) 可以和命名空间组合使用：示例
*#maincontent {border: 1px solid blue;} -上面的CSS作用于下面的HTML:
+上面的 CSS 作用于下面的 HTML:
<p class="warning"> <span lang="en-us">A green span</span> in a red paragraph. @@ -38,13 +38,13 @@
-示例
</p>则会产生这样的效果:
+则会产生这样的效果：
A green span in a red paragraph.
A red span in a green paragraph (with a border.)
-注: 笔者不推荐使用通配选择器,因为它是性能最低的一个CSS选择器.+注：笔者不推荐使用通配选择器，因为它是性能最低的一个 CSS 选择器.规范
diff --git a/files/zh-cn/web/css/unset/index.html b/files/zh-cn/web/css/unset/index.html index 9ebce13cbf1591..91348a62996a68 100644 --- a/files/zh-cn/web/css/unset/index.html +++ b/files/zh-cn/web/css/unset/index.html @@ -10,7 +10,7 @@ ---{{CSSRef}}-CSS关键字
+unset可以分为两种情况，如果这个属性本来有从父级继承的值（这个属性默认可以继承，且父级有定义），则将该属性重新设置为继承的值，如果没有继承父级样式，则将该属性重新设置为初始值。换句话说，在第一种情况下（继承属性）它的行为类似于{{cssxref("inherit")}} ，在第二种情况下（非继承属性）类似于{{cssxref("initial")}}。它可以应用于任何CSS属性，包括CSS简写属性 {{cssxref("all")}} 。CSS 关键字
unset可以分为两种情况，如果这个属性本来有从父级继承的值（这个属性默认可以继承，且父级有定义），则将该属性重新设置为继承的值，如果没有继承父级样式，则将该属性重新设置为初始值。换句话说，在第一种情况下（继承属性）它的行为类似于{{cssxref("inherit")}} ，在第二种情况下（非继承属性）类似于{{cssxref("initial")}}。它可以应用于任何 CSS 属性，包括 CSS 简写属性 {{cssxref("all")}} 。示例
@@ -91,7 +91,7 @@规范
{{ SpecName('CSS4 Cascade', '#inherit-initial', 'unset') }} {{ Spec2('CSS4 Cascade') }} -与Level 3无变化 +与 Level 3 无变化 {{ SpecName('CSS3 Cascade', '#unset', 'unset') }} @@ -109,7 +109,7 @@参见
语法
-注意: 从 Firefox 15 开始，不再允许在未用引号包含的 url() 中使用大于 0x7e 的控制字符。详情请查看 {{Bug(752230)}}。
+注意： 从 Firefox 15 开始，不再允许在未用引号包含的 url() 中使用大于 0x7e 的控制字符。详情请查看 {{Bug(752230)}}。
示例
diff --git a/files/zh-cn/web/css/used_value/index.html b/files/zh-cn/web/css/used_value/index.html index ed63dc82567190..5de383f81a6cd3 100644 --- a/files/zh-cn/web/css/used_value/index.html +++ b/files/zh-cn/web/css/used_value/index.html @@ -3,23 +3,23 @@ slug: Web/CSS/used_value translation_of: Web/CSS/used_value --- -CSS 属性的应用值（used value）是完成所有计算后最终使用的值，可以由 window.getComputedStyle 获取。尺寸 (例如
+width,line-height) 单位为像素, 简写属性 (例如 background) 与组成属性相符 (例如background-color，display) 与position、float相符，每个 CSS 属性都有值。CSS 属性的应用值（used value）是完成所有计算后最终使用的值，可以由 window.getComputedStyle 获取。尺寸 (例如
width,line-height) 单位为像素，简写属性 (例如 background) 与组成属性相符 (例如background-color，display) 与position、float相符，每个 CSS 属性都有值。详情
-计算出CSS属性的最终值有三个步骤。首先，指定值specified value 取自样式层叠 (选取样式表里权重最高的规则), 继承 (如果属性可以继承则取父元素的值)，或者默认值。然后，按规范算出 计算值computed value (例如，
+span指定position: absolute后display变为block)。最后，计算布局(尺寸比如auto或 百分数 换算为像素值 )， 结果即 应用值used value。这些步骤是在内部完成的，脚本只能使用 window.getComputedStyle 获得最终的应用值。计算出 CSS 属性的最终值有三个步骤。首先，指定值 specified value 取自样式层叠 (选取样式表里权重最高的规则), 继承 (如果属性可以继承则取父元素的值)，或者默认值。然后，按规范算出 计算值 computed value (例如，
span指定position: absolute后display变为block)。最后，计算布局 (尺寸比如auto或 百分数 换算为像素值 )，结果即 应用值 used value。这些步骤是在内部完成的，脚本只能使用 window.getComputedStyle 获得最终的应用值。举例
-没有明确的宽度。指定的宽度: auto (默认). 计算的宽度: auto. 应用的宽度: 998px (举例而言)。 -明确的宽度: 50%. 指定的宽度: 50%. 计算的宽度: 50%. 应用的宽度: 447px -明确的宽度: inherit. 指定的宽度: 50%. 计算的宽度: 50%. 应用的宽度: 221px .+没有明确的宽度。指定的宽度：auto (默认). 计算的宽度：auto. 应用的宽度：998px (举例而言)。 +明确的宽度：50%. 指定的宽度：50%. 计算的宽度：50%. 应用的宽度：447px +明确的宽度：inherit. 指定的宽度：50%. 计算的宽度：50%. 应用的宽度：221px .与计算值的区别
-CSS 2.0 只定义了 计算值 computed value 作为属性计算的最后一步。 CSS 2.1 引进了定义明显不同的的应用值，这样当父元素的计算值为百分数时子元素可以显式地继承其高宽。 对于不依赖于布局的 CSS 属性 (例如 display, font-size, line-height)计算值与应用值一样，否则就会不一样 (引自 CSS 2.1 Changes: Specified, computed, and actual values):
+CSS 2.0 只定义了 计算值 computed value 作为属性计算的最后一步。CSS 2.1 引进了定义明显不同的的应用值，这样当父元素的计算值为百分数时子元素可以显式地继承其高宽。对于不依赖于布局的 CSS 属性 (例如 display, font-size, line-height) 计算值与应用值一样，否则就会不一样 (引自 CSS 2.1 Changes: Specified, computed, and actual values):
语法
自定义属性（有时候也被称作CSS变量或者级联变量）是由CSS作者定义的，它包含的值可以在整个文档中重复使用。由自定义属性标记设定值（比如：+--main-color: black;），由var() 函数来获取值（比如：color: var(--main-color);）自定义属性（有时候也被称作CSS 变量或者级联变量）是由 CSS 作者定义的，它包含的值可以在整个文档中重复使用。由自定义属性标记设定值（比如：---main-color: black;），由var() 函数来获取值（比如：color: var(--main-color);）复杂的网站都会有大量的CSS代码，通常也会有许多重复的值。举个例子，同样一个颜色值可能在成千上百个地方被使用到，如果这个值发生了变化，需要全局搜索并且一个一个替换（很麻烦哎～）。自定义属性在某个地方存储一个值，然后在其他许多地方引用它。另一个好处是语义化的标识。比如，+--main-text-color会比#00ff00更易理解，尤其是这个颜色值在其他上下文中也被使用到。复杂的网站都会有大量的 CSS 代码，通常也会有许多重复的值。举个例子，同样一个颜色值可能在成千上百个地方被使用到，如果这个值发生了变化，需要全局搜索并且一个一个替换（很麻烦哎～）。自定义属性在某个地方存储一个值，然后在其他许多地方引用它。另一个好处是语义化的标识。比如，@@ -20,14 +20,14 @@--main-text-color会比#00ff00更易理解，尤其是这个颜色值在其他上下文中也被使用到。基本用法
-声明一个自定义属性，属性名需要以两个减号（
+--）开始，属性值则可以是任何有效的CSS值。和其他属性一样，自定义属性也是写在规则集之内的，如下：声明一个自定义属性，属性名需要以两个减号（
--）开始，属性值则可以是任何有效的 CSS 值。和其他属性一样，自定义属性也是写在规则集之内的，如下：element { --main-bg-color: brown; }-注意，规则集所指定的选择器定义了自定义属性的可见作用域。通常的最佳实践是定义在根伪类 {{cssxref(":root")}} 下，这样就可以在HTML文档的任何地方访问到它了：
+注意，规则集所指定的选择器定义了自定义属性的可见作用域。通常的最佳实践是定义在根伪类 {{cssxref(":root")}} 下，这样就可以在 HTML 文档的任何地方访问到它了：
:root { --main-bg-color: brown; @@ -48,7 +48,7 @@基本用法
使用自定义属性的第一步
-我们从这个简单的CSS代码开始，它将相同的颜色应用在了不同class的元素上：
+我们从这个简单的 CSS 代码开始，它将相同的颜色应用在了不同 class 的元素上：
-.one { color: white; @@ -85,7 +85,7 @@使用自定义属性的第一步
应用在如下HTML上：
+应用在如下 HTML 上：
<div> <div class="one">1:</div> @@ -99,7 +99,7 @@使用自定义属性的第一步
{{EmbedLiveSample("First_steps_with_custom_properties",600,180)}} -注意到在CSS代码中的重复：背景色
+brown被多处设置。对于一些CSS声明，是可以在级联关系更高的位置设置，通过CSS继承自然地解决这个重复的问题。但在一般项目中，是不可能通过这样的方式去解决。通过在 {{cssxref(":root")}} 伪类上设置自定义属性，然后在整个文档需要的地方使用，可以减少这样的重复性：注意到在 CSS 代码中的重复：背景色
brown被多处设置。对于一些 CSS 声明，是可以在级联关系更高的位置设置，通过 CSS 继承自然地解决这个重复的问题。但在一般项目中，是不可能通过这样的方式去解决。通过在 {{cssxref(":root")}} 伪类上设置自定义属性，然后在整个文档需要的地方使用，可以减少这样的重复性：:root { --main-bg-color: brown; @@ -144,7 +144,7 @@使用自定义属性的第一步
自定义属性的继承性 -自定义属性会继承。这意味着如果在一个给定的元素上，没有为这个自定义属性设置值，在其父元素上的值会被使用。看这一段HTML：
+自定义属性会继承。这意味着如果在一个给定的元素上，没有为这个自定义属性设置值，在其父元素上的值会被使用。看这一段 HTML：
-<div class="one"> <div class="two"> @@ -154,7 +154,7 @@自定义属性的继承性
</div>配套的CSS：
+配套的 CSS：
.two { --test: 10px; @@ -173,14 +173,14 @@自定义属性的继承性
注意，这些是自定义属性，并不是你在其他编程语言中遇到的实际的变量。这些值仅当需要的时候才会计算，而并不会按其他规则进行保存。比如，你不能为元素设置一个属性，然后让它从兄弟或旁支子孙规则上获取值。属性仅用于匹配当前选择器及其子孙，这和通常的CSS是一样的。
+注意，这些是自定义属性，并不是你在其他编程语言中遇到的实际的变量。这些值仅当需要的时候才会计算，而并不会按其他规则进行保存。比如，你不能为元素设置一个属性，然后让它从兄弟或旁支子孙规则上获取值。属性仅用于匹配当前选择器及其子孙，这和通常的 CSS 是一样的。
自定义属性备用值
用 {{cssxref("var()")}} 函数可以定义多个备用值(fallback value)，当给定值未定义时将会用备用值替换。这对于 Custom Elements 和 Shadow DOM 都很有用。
-备用值并不是用于实现浏览器兼容性的。如果浏览器不支持CSS自定义属性，备用值也没什么用。它仅对支持CSS自定义属性的浏览器提供了一个备份机制，该机制仅当给定值未定义或是无效值的时候生效。
+备用值并不是用于实现浏览器兼容性的。如果浏览器不支持 CSS 自定义属性，备用值也没什么用。它仅对支持 CSS 自定义属性的浏览器提供了一个备份机制，该机制仅当给定值未定义或是无效值的时候生效。
函数的第一个参数是自定义属性的名称。如果提供了第二个参数，则表示备用值，当自定义属性值无效时生效。第二个参数可以嵌套，但是不能继续平铺展开下去了，例如：
@@ -205,9 +205,9 @@自定义属性备用值
有效性和值
-传统的CSS概念里，有效性和属性是绑定的，这对自定义属性来说并不适用。当自定义属性值被解析，浏览器不知道它们什么时候会被使用，所以必须认为这些值都是有效的。
+传统的 CSS 概念里，有效性和属性是绑定的，这对自定义属性来说并不适用。当自定义属性值被解析，浏览器不知道它们什么时候会被使用，所以必须认为这些值都是有效的。
-不幸的是，即便这些值是有效的，但当通过
+var()函数调用时，它在特定上下文环境下也可能不会奏效。属性和自定义变量会导致无效的CSS语句，这引入了一个新的概念：计算时有效性。不幸的是，即便这些值是有效的，但当通过
var()函数调用时，它在特定上下文环境下也可能不会奏效。属性和自定义变量会导致无效的 CSS 语句，这引入了一个新的概念：计算时有效性。无效变量会导致什么？
@@ -240,7 +240,7 @@Result
段落颜色并不是蓝色，因为无效代换导致了它被替换成了默认初始值的黑色。如果你直接写
color: 16px的话，则会导致语法错误，而前面的定义则会生效（段落显示为蓝色）。-注意：当CSS属性-值对中存在语法错误，该行则会被忽略。然而如果自定义属性的值无效，它并不会被忽略，从而会导致该值被覆盖为默认值。
+注意：当 CSS 属性 - 值对中存在语法错误，该行则会被忽略。然而如果自定义属性的值无效，它并不会被忽略，从而会导致该值被覆盖为默认值。
JavaScript 中的值
diff --git a/files/zh-cn/web/css/value_definition_syntax/index.html b/files/zh-cn/web/css/value_definition_syntax/index.html index 98f3709bb26349..cb8608b02b811b 100644 --- a/files/zh-cn/web/css/value_definition_syntax/index.html +++ b/files/zh-cn/web/css/value_definition_syntax/index.html @@ -1,13 +1,13 @@ --- -title: CSS属性值定义语法 +title: CSS 属性值定义语法 slug: Web/CSS/Value_definition_syntax translation_of: Web/CSS/Value_definition_syntax ---{{ CSSRef() }}
-CSS属性值定义语法（CSS value definition syntax）是用来限定CSS属性合法取值的专门语法。在此基础之上，一个CSS属性的合法取值也由语义所限制，比如一些数字必须是正数。
+CSS 属性值定义语法（CSS value definition syntax）是用来限定 CSS 属性合法取值的专门语法。在此基础之上，一个 CSS 属性的合法取值也由语义所限制，比如一些数字必须是正数。
-CSS属性值定义语法描述了哪些值是可取的CSS属性，基本组成元素包括关键字、符号与带类型的参数。
+CSS 属性值定义语法描述了哪些值是可取的 CSS 属性，基本组成元素包括关键字、符号与带类型的参数。
基本组成元素
@@ -19,19 +19,19 @@一般关键字
特殊关键字：
-inherit、initial和unset所有CSS属性值都可以使用
+inherit、initial和unset，它们的定义贯穿 CSS 始终。它们未显示在值定义中，但都是隐含可用的。所有 CSS 属性值都可以使用
inherit、initial和unset，它们的定义贯穿 CSS 始终。它们未显示在值定义中，但都是隐含可用的。符号
-CSS中，有一些符号是可以出现的，比如斜杠('
+/')或者逗号(',')等。它们用来分隔属性值：逗号用来分隔数个并列值，或者分隔函数的参数；斜杠用来分隔一个值的多个部分，通常用在CSS缩写中分离具有相同类型但属于不同属性的组件。CSS 中，有一些符号是可以出现的，比如斜杠 ('
-/') 或者逗号 (',') 等。它们用来分隔属性值：逗号用来分隔数个并列值，或者分隔函数的参数；斜杠用来分隔一个值的多个部分，通常用在 CSS 缩写中分离具有相同类型但属于不同属性的组件。这两种符号会以其字面意义出现在CSS属性值定义中。
+这两种符号会以其字面意义出现在 CSS 属性值定义中。
带类型的参数
基本类型
-一些类型在CSS中经常出现，CSS规范中将其专门定义，称为基本类型，用一对尖括号表示：'
+<'与'>'，例如：{{ cssxref("<angle>") }}, {{cssxref("<string>")}}, …一些类型在 CSS 中经常出现，CSS 规范中将其专门定义，称为基本类型，用一对尖括号表示：'
<'与'>'，例如：{{ cssxref("<angle>") }}, {{cssxref("<string>")}}, …其他类型
@@ -137,7 +137,7 @@“或”组合符：||
注：“与”组合符的优先级高于“或”组合符，比如+bold || thin && <length>等价于bold || [ thin && <length> ]。它们的合法取值是：bold,thin<length>,bold thin<length>, 或者thin <length> bold，但不是：<length>bold thin因为bold若出现，则必须出现在thin && <length>整体的前面或后面。注：“与”组合符的优先级高于“或”组合符，比如bold || thin && <length>等价于bold || [ thin && <length> ]。它们的合法取值是：bold,thin<length>,bold thin<length>, 或者thin <length> bold，但不是：<length>bold thin因为 bold 若出现，则必须出现在thin && <length>整体的前面或后面。“互斥”组合符：|
@@ -239,7 +239,7 @@问号 (
?)大括号 (
-{ })大括号包含两个以逗号分隔的整数A与B，表示最少出现A次，且最多出现B次。例如：
+大括号包含两个以逗号分隔的整数 A 与 B，表示最少出现 A 次，且最多出现 B 次。例如：
diff --git a/files/zh-cn/web/css/var/index.html b/files/zh-cn/web/css/var/index.html index f9b926cfb1c5c5..78af8e534d4691 100644 --- a/files/zh-cn/web/css/var/index.html +++ b/files/zh-cn/web/css/var/index.html @@ -31,7 +31,7 @@bold smaller{1,3}值
vertical-align属性可被用于两种环境：
+vertical-align 属性可被用于两种环境：
{{EmbedLiveSample("vertical-align-inline", 1200, 160)}}
-
-
@@ -138,7 +138,7 @@相对父元素的值
相对父元素的值
规范
{{SpecName('CSS2.1', 'visudet.html#propdef-vertical-align', 'vertical-align')}} {{Spec2('CSS2.1')}} -增加 {{cssxref("<length>")}} 取值， 允许它对{{cssxref("display")}}类型为 +table-cell的元素生效。增加 {{cssxref("<length>")}} 取值，允许它对{{cssxref("display")}}类型为 table-cell的元素生效。{{SpecName('CSS1', '#vertical-align', 'vertical-align')}} diff --git a/files/zh-cn/web/css/viewport_concepts/index.html b/files/zh-cn/web/css/viewport_concepts/index.html index 9ad2a76a531273..547935ad4596a1 100644 --- a/files/zh-cn/web/css/viewport_concepts/index.html +++ b/files/zh-cn/web/css/viewport_concepts/index.html @@ -9,7 +9,7 @@什么是 viewport ?
-视口 (viewport) 代表当前可见的计算机图形区域。在 Web 浏览器术语中，通常与浏览器窗口相同，但不包括浏览器的 UI， 菜单栏等——即指你正在浏览的文档的那一部分。
+视口 (viewport) 代表当前可见的计算机图形区域。在 Web 浏览器术语中，通常与浏览器窗口相同，但不包括浏览器的 UI，菜单栏等——即指你正在浏览的文档的那一部分。
文档，比如这篇文章，可能会非常长。你的 viewport 就是你现在所能见到的所有事物。值得注意的是“什么是视口区域”这个问题，页面中的一些导航菜单也包括在其中。Viewport 的大小取决于屏幕的大小，无论浏览器是否处于全屏模式，是否被用户缩放了。Viewport 外的区域，比如这个文档的 See Also 部分，可能需要滚动到其所在的区域才会出现在屏幕上。
@@ -35,19 +35,19 @@Viewport 大小是可变的
window.outerHeight /* 900 */ -下面是一些帮助你查询查询 viewport 大小和其它类似的长度属性的 DOM 属性:
+下面是一些帮助你查询查询 viewport 大小和其它类似的长度属性的 DOM 属性：
-
-
在实测中，
+innerWidth和outerWidth是相同的，但是outerHeight比innerHeight高100px。这是因为outerHeight的测量包括浏览器框架在内，包括了地址栏和书签栏总共 100px 的高度，而浏览器没有左右边框。在实测中，
innerWidth和outerWidth是相同的，但是outerHeight比innerHeight高 100px。这是因为outerHeight的测量包括浏览器框架在内，包括了地址栏和书签栏总共 100px 的高度，而浏览器没有左右边框。
-innerHeight和innerWidth所组成的区域通常被认为是布局视口 (layout viewport)。浏览器的框架不被认为是 viewport 的一部分。当缩放时， Firefox 和 Chrome 对
+innerWidth和clientWidth给出了新的 CSS 像素大小。浏览器对outerWidth和outerHeight的返回值有差异。Firefox 返回了缩放后的 CSS 像素值，Chrome 返回了默认的像素值：当缩放时，Firefox 和 Chrome 对
innerWidth和clientWidth给出了新的 CSS 像素大小。浏览器对outerWidth和outerHeight的返回值有差异。Firefox 返回了缩放后的 CSS 像素值，Chrome 返回了默认的像素值：document.documentElement.clientWidth /* 800 */ window.innerWidth /* 800 */ @@ -75,7 +75,7 @@
Viewport 大小是可变的
Web 浏览器包含两个 viewport，布局视口 (layout viewport) 和视觉视口 (visual viewport)。visual viewport 指当前浏览器中可见的部分，并且可以变化。当使用触屏双指缩放，当动态键盘在手机上弹出的时候，或者之前隐藏的地址栏变得可见的时候，visual viewport 缩小了，但是 layout viewport 却保持不变。
-我们上面说到的固定的头部和尾部，固定在 layout viewport 的底部和顶部，所以当 visual viewport 缩小的时候,头部和尾部仍保留在视觉中。当你缩放页面时，布局视口可能不能被全部看到。如果你放大布局视口的中间部分，内容将在四个方向上扩展。如果你有一个固定的头部和底部，它们依然固定在布局视口的顶部和底部，因此它们可能会在设备屏幕的底部和顶部不可见-视觉视口。视觉视口是布局视口当前的可见部分如果你向下滚动，视觉视口的内容就会改变，并布局视口的底部就会滚动到可视区域。
+我们上面说到的固定的头部和尾部，固定在 layout viewport 的底部和顶部，所以当 visual viewport 缩小的时候，头部和尾部仍保留在视觉中。当你缩放页面时，布局视口可能不能被全部看到。如果你放大布局视口的中间部分，内容将在四个方向上扩展。如果你有一个固定的头部和底部，它们依然固定在布局视口的顶部和底部，因此它们可能会在设备屏幕的底部和顶部不可见 - 视觉视口。视觉视口是布局视口当前的可见部分如果你向下滚动，视觉视口的内容就会改变，并布局视口的底部就会滚动到可视区域。
视觉视口是屏幕的可视部分，不包括屏幕键盘，缩放外的区域。视觉视口要么跟布局视口相同，要么更小
@@ -83,15 +83,15 @@Viewport 大小是可变的
CSS
-在上面描述的布局视口 (layout viewport) 和视觉视口 (visual viewport) 不是您将遇到的唯一视口。 在布局视口中完全或部分显示的任何子视口都被视为可视视口。
+在上面描述的布局视口 (layout viewport) 和视觉视口 (visual viewport) 不是您将遇到的唯一视口。在布局视口中完全或部分显示的任何子视口都被视为可视视口。
-我们通常认为宽度和高度的媒体查询是相对于浏览器窗口的宽度和高度而言的。 它们实际上是相对于视口的，即主文档（document）中的窗口（window对象），但它也是嵌套浏览上下文（如对象，iframe和SVG）中元素父级的本身的大小。 在CSS中，我们也有基于视口大小的长度单位。 1vh 单位是 1% 布局视口的高度，vw 单位与此类似。
+我们通常认为宽度和高度的媒体查询是相对于浏览器窗口的宽度和高度而言的。它们实际上是相对于视口的，即主文档（document）中的窗口（window 对象），但它也是嵌套浏览上下文（如对象，iframe 和 SVG）中元素父级的本身的大小。在 CSS 中，我们也有基于视口大小的长度单位。1vh 单位是 1% 布局视口的高度，vw 单位与此类似。
<iframe>对于一个
-iframe来说，视觉视口是其内部高度和宽度的大小而不是其父文档的大小。你可以为其高度和宽度设置任意数值，但过大的值可能会使iframe部分内容超出视口导致超出部分不可见。在 CSS 中，可以使用相对于视口的长度单位
+vh和vw。 1vh 意味着值为视口高度的 1%，同理 1vw 即值为视口宽度的 1%。在 CSS 中，可以使用相对于视口的长度单位
vh和vw。1vh 意味着值为视口高度的 1%，同理 1vw 即值为视口宽度的 1%。需要注意的是，当你在 CSS 中使用
@@ -132,7 +132,7 @@vw和vh设置iframe的样式时，1vh 表示的是iframe高度的 1%，但 1vw 表示的则是 document 宽度的 1%。SVG
如使用 {{htmlelement("img")}} ，通过设置 src 指向 SVG 文件时，SVG 的外部容器，或者说包裹着 SVG 的元素就是这个 img。如果在这个外部容器上应用了 width 属性，则对应的视口就是这个属性的值，而不是整个文档的视口宽度。
-如果把上面的 CSS 媒体查询样式添加到 SVG 文件中去，当 SVG 容器的宽度在 400 - 500 px时，将应用该 CSS 样式。
+如果把上面的 CSS 媒体查询样式添加到 SVG 文件中去，当 SVG 容器的宽度在 400 - 500 px 时，将应用该 CSS 样式。
JavaScript
diff --git a/files/zh-cn/web/css/visibility/index.html b/files/zh-cn/web/css/visibility/index.html index fe437c059f76b4..a4ad389491d11a 100644 --- a/files/zh-cn/web/css/visibility/index.html +++ b/files/zh-cn/web/css/visibility/index.html @@ -7,7 +7,7 @@ ---{{CSSRef()}}
-CSS属性
+visibility显示或隐藏元素而不更改文档的布局。该属性还可以隐藏{{HTMLElement("table")}}中的行或列。CSS 属性
visibility显示或隐藏元素而不更改文档的布局。该属性还可以隐藏 {{HTMLElement("table")}} 中的行或列。{{EmbedInteractiveExample("pages/css/visibility.html")}}diff --git a/files/zh-cn/web/css/visual_formatting_model/index.html b/files/zh-cn/web/css/visual_formatting_model/index.html index f6858cf65ad425..42c211b54857ef 100644 --- a/files/zh-cn/web/css/visual_formatting_model/index.html +++ b/files/zh-cn/web/css/visual_formatting_model/index.html @@ -3,7 +3,7 @@ slug: Web/CSS/Visual_formatting_model tags: - CSS - - CSS盒模型 + - CSS 盒模型 - 参考 translation_of: Web/CSS/Visual_formatting_model original_slug: Web/Guide/CSS/Visual_formatting_model @@ -16,7 +16,7 @@
-视觉格式化模型会根据CSS盒子模型将文档中的元素转换为一个个盒子，每个盒子的布局由以下因素决定：
+视觉格式化模型会根据CSS 盒子模型将文档中的元素转换为一个个盒子，每个盒子的布局由以下因素决定：
注意：盒子分为“块盒子”和“块级盒子”两种，但元素只有“块级元素”，而没有“块元素”。下面的“行内级元素”也是一样。
@@ -75,17 +75,17 @@块级元素与块盒子
一个同时是块容器盒子的块级盒子称为块盒子（block box）。
-匿名块盒子
+匿名块盒子
-在某些情况下进行视觉格式化时，需要添加一些增补性的盒子，这些盒子不能用CSS选择符选中，因此称为匿名盒子（anonymous boxes）。
+在某些情况下进行视觉格式化时，需要添加一些增补性的盒子，这些盒子不能用 CSS 选择符选中，因此称为匿名盒子（anonymous boxes）。
-CSS选择器不能作用于匿名盒子(anonymous boxes)，所以它不能被样式表赋予样式。也就是说，此时所有可继承的 CSS 属性值都为
+inherit，而所有不可继承的 CSS 属性值都为initial。CSS 选择器不能作用于匿名盒子 (anonymous boxes)，所以它不能被样式表赋予样式。也就是说，此时所有可继承的 CSS 属性值都为
inherit，而所有不可继承的 CSS 属性值都为initial。块包含盒子可能只包含行内级盒子，也可能只包含块级盒子，但通常的文档都会同时包含两者，在这种情况下，就会在相邻的行内级盒子外创建匿名块盒子。
示例
-考虑下面的HTML代码，假设 {{ HTMLElement("div") }} 和 {{ HTMLElement("p") }} 都保持默认的样式（即它们的
+display为block）：考虑下面的 HTML 代码，假设 {{ HTMLElement("div") }} 和 {{ HTMLElement("p") }} 都保持默认的样式（即它们的
display为block）：<div>Some inline text <p>followed by a paragraph</p> followed by more inline text.</div>
@@ -101,7 +101,7 @@示例
followed by more inline text. -对这两个匿名盒子来说，程序员无法像 {{ HTMLElement("p") }} 元素那样控制它们的样式，因此它们会从 {{ HTMLElement("div") }} 那里继承那些可继承的属性，如 {{ cssxref("color") }}。其他不可继承的属性则会设置为
+initial，比如，因为没有为它们指定 {{ cssxref("background-color") }}，因此其具有默认的透明背景，而<p>元素的盒子则能够用CSS指定背景颜色。类似地，两个匿名盒子的文本颜色总是一样的。对这两个匿名盒子来说，程序员无法像 {{ HTMLElement("p") }} 元素那样控制它们的样式，因此它们会从 {{ HTMLElement("div") }} 那里继承那些可继承的属性，如 {{ cssxref("color") }}。其他不可继承的属性则会设置为
initial，比如，因为没有为它们指定 {{ cssxref("background-color") }}，因此其具有默认的透明背景，而<p>元素的盒子则能够用 CSS 指定背景颜色。类似地，两个匿名盒子的文本颜色总是一样的。另一种会创建匿名块盒子的情况是一个行内盒子中包含一或多个块盒子。此时，包含块盒子的盒子会拆分为两个行内盒子，分别位于块盒子的前面和后面。块盒子前面的所有行内盒子会被一个匿名块盒子包裹，块盒子后面的行内盒子也是一样。因此，块盒子将成为这两个匿名块盒子的兄弟盒子。
@@ -109,7 +109,7 @@示例
示例
-考虑下面的HTML代码，假设 {{ HTMLElement("p") }} 的
+display为 inline，{{ HTMLElement("span") }} 的display为block：考虑下面的 HTML 代码，假设 {{ HTMLElement("p") }} 的
display为 inline，{{ HTMLElement("span") }} 的display为block：
@@ -132,7 +132,7 @@<p>Some <em>inline</em> text <span>followed by a paragraph</span> followed by more inline text.</p>行内级元素和行内盒子
-该图使用了过时的术语，见下面的“注意”（译注：指图中的 “Atomic inline boxes”）。除此之外该图还有一个错误，右边的黄色部分应该完全包含左侧的椭圆（类似于数学上的超集），因为标准所说的是“如果行内级元素生成的盒子参与行内格式化上下文的创建，则该盒子为一个行内级盒子”，见“CSS 2.2标准的9.2.2节”。
+该图使用了过时的术语，见下面的“注意”（译注：指图中的“Atomic inline boxes”）。除此之外该图还有一个错误，右边的黄色部分应该完全包含左侧的椭圆（类似于数学上的超集），因为标准所说的是“如果行内级元素生成的盒子参与行内格式化上下文的创建，则该盒子为一个行内级盒子”，见“CSS 2.2 标准的 9.2.2 节”。
行内级元素会生成行内级盒子，该盒子同时会参与行内格式化上下文（inline formatting context）的创建。行内盒子既是行内级盒子，也是一个其内容会参与创建其容器的行内格式化上下文的盒子，比如所有具有
@@ -184,11 +184,11 @@display:inline样式的非替换盒子。如果一个行内级盒子的内容不参与行内格式化上下文的创建，则称其为原子行内级盒子。而通过替换行内级元素或display值为inline-block或inline-table的元素创建的盒子不会像行内盒子一样可以被拆分为多个盒子。行内级元素和行内盒子
匿名行内盒子
-类似于块盒子，CSS引擎有时候也会自动创建一些行内盒子。这些行内盒子无法被选择符选中，因此是匿名的，它们从父元素那里继承那些可继承的属性，其他属性保持默认值+initial。类似于块盒子，CSS 引擎有时候也会自动创建一些行内盒子。这些行内盒子无法被选择符选中，因此是匿名的，它们从父元素那里继承那些可继承的属性，其他属性保持默认值initial。-一种常见的情况是CSS引擎会自动为直接包含在块盒子中的文本创建一个行内格式化上下文，在这种情况下，这些文本会被一个足够大的匿名行内盒子所包含。但是如果仅包含空格则有可能不会生成匿名行内盒子，因为空格有可能会由于 {{ cssxref("white-space") }} 的设置而被移除，从而导致最终的实际内容为空。+一种常见的情况是 CSS 引擎会自动为直接包含在块盒子中的文本创建一个行内格式化上下文，在这种情况下，这些文本会被一个足够大的匿名行内盒子所包含。但是如果仅包含空格则有可能不会生成匿名行内盒子，因为空格有可能会由于 {{ cssxref("white-space") }} 的设置而被移除，从而导致最终的实际内容为空。@@ -200,7 +200,7 @@行盒子
行盒子由行内格式化上下文创建，用来显示一行文本。在块盒子内部，行盒子总是从块盒子的一边延伸到另一边（译注：即占据整个块盒子的宽度）。当有浮动元素时，行盒子会从向左浮动的元素的右边缘延伸到向右浮动的元素的左边缘。
-行盒子更多是以技术性目的而存在的，Web开发者通常不需要关心。+行盒子更多是以技术性目的而存在的，Web 开发者通常不需要关心。Run-in 盒子
@@ -209,24 +209,24 @@Run-in 盒子
-注意：Run-in 盒子已经在CSS 2.1的标准中移除了，但可能会在CSS 3中作为一个实验性的内容再次加入。因此最好不要将其用于正式项目。
+注意：Run-in 盒子已经在 CSS 2.1 的标准中移除了，但可能会在 CSS 3 中作为一个实验性的内容再次加入。因此最好不要将其用于正式项目。
由其他模型引入的盒子
-除了行内格式化上下文和块格式化上下文之外，CSS还定义了几种内容模型，这些模型同样可以应用于元素。这些模型一般用来描述布局，它们可能会定义一些额外的盒子类型：+除了行内格式化上下文和块格式化上下文之外，CSS 还定义了几种内容模型，这些模型同样可以应用于元素。这些模型一般用来描述布局，它们可能会定义一些额外的盒子类型：定位规则
-一旦生成了盒子以后，CSS引擎就需要定位它们以完成布局。下面是定位盒子时所使用的规则：
+一旦生成了盒子以后，CSS 引擎就需要定位它们以完成布局。下面是定位盒子时所使用的规则：
定位规则
普通流
-在普通流中，盒子会依次放置。在块格式化上下文中，盒子在垂直方向依次排列；而在行内格式化上下文中，盒子则水平排列。当CSS的 {{ cssxref("position") }} 属性为+static或relative，并且 {{ cssxref("float") }} 为none时，其布局方式为普通流。在普通流中，盒子会依次放置。在块格式化上下文中，盒子在垂直方向依次排列；而在行内格式化上下文中，盒子则水平排列。当 CSS 的 {{ cssxref("position") }} 属性为static或relative，并且 {{ cssxref("float") }} 为none时，其布局方式为普通流。示例
diff --git a/files/zh-cn/web/css/webkit_extensions/index.html b/files/zh-cn/web/css/webkit_extensions/index.html index 340a276df614f0..275a9514320806 100644 --- a/files/zh-cn/web/css/webkit_extensions/index.html +++ b/files/zh-cn/web/css/webkit_extensions/index.html @@ -5,8 +5,8 @@ ---{{ CSSRef() }}
-WebKit支持大量的CSS扩展,这种css属性的前缀
-为-webkit-.这些属性其中的一部分已经被包含在 CSS 规范草案中,并且可能成为最后的推荐标准,但目前仍然是试验性的属性, 还有一些属性是不规范的属性,它们没有出现在跟踪规范中.
+WebKit 支持大量的CSS扩展，这种 css 属性的前缀
+为-webkit-.这些属性其中的一部分已经被包含在 CSS 规范草案中，并且可能成为最后的推荐标准，但目前仍然是试验性的属性， 还有一些属性是不规范的属性，它们没有出现在跟踪规范中。
WebKit-前缀属性 (跟踪规范)
A @@ -93,7 +93,7 @@WebKit-prefix
私有WebKit-前缀属性（不使用网页上）
+私有 WebKit-前缀属性（不使用网页上）
A
-
diff --git a/files/zh-cn/web/css/white-space/index.html b/files/zh-cn/web/css/white-space/index.html
index 1b3fe4a23792fc..9b78668e05a006 100644
--- a/files/zh-cn/web/css/white-space/index.html
+++ b/files/zh-cn/web/css/white-space/index.html
@@ -33,15 +33,15 @@
值
break-spaces
diff --git a/files/zh-cn/web/css/width/index.html b/files/zh-cn/web/css/width/index.html index 73c220a6ea36cf..0997c696e61f4d 100644 --- a/files/zh-cn/web/css/width/index.html +++ b/files/zh-cn/web/css/width/index.html @@ -60,7 +60,7 @@值
- 关键字
值
值
正式语法
diff --git a/files/zh-cn/web/css/transform-box/index.html b/files/zh-cn/web/css/transform-box/index.html index b67283c99a26f1..1f061033c600a3 100644 --- a/files/zh-cn/web/css/transform-box/index.html +++ b/files/zh-cn/web/css/transform-box/index.html @@ -30,7 +30,7 @@值
笛卡尔 坐标
-
在笛卡尔坐标系中，每个 欧氏空间 里的点都由横坐标和纵坐标这两个值来确定。 在 CSS（和大部分的计算机图形学）中，原点
+(0, 0)在元素的左上角。每个点都使用数学上的向量符号 (x,y) 来描述。在笛卡尔坐标系中，每个 欧氏空间 里的点都由横坐标和纵坐标这两个值来确定。在 CSS（和大部分的计算机图形学）中，原点
(0, 0)在元素的左上角。每个点都使用数学上的向量符号 (x,y) 来描述。每个线性函数使用 2 × 2 矩阵描述，如：
@@ -166,7 +166,7 @@参数
@@ -191,7 +191,7 @@
参数
-rotate()
+
The rotate()CSS 函数 定义一个旋转属性，将元素在不变形的情况下旋转到不动点周围 (如 {{ Cssxref("transform-origin") }} 属性所指定) 。 移动量由指定角度定义;如果为正值，则运动将为顺时针，如果为负值，则为逆时针 。 180°的旋转称为点反射 (point reflection)。
@@ -233,9 +233,9 @@The rotate()CSS 函数 定义一个旋转属性，将元素在不变形的情况下旋转到不动点周围 (如 {{ Cssxref("transform-origin") }} 属性所指定) 。移动量由指定角度定义;如果为正值，则运动将为顺时针，如果为负值，则为逆时针。180°的旋转称为点反射 (point reflection)。参数
-rotate3d()
+rotate3d()这个 CSS 函数定义一个 3D 旋转功能，该旋转使元素能够绕固定轴移动而不变形。 其中移动量由指定角度定义；如果为正值，则运动将为顺时针，如果为负值，则为逆时针。
-rotate3d()这个 CSS 函数定义一个 3D 旋转功能，该旋转使元素能够绕固定轴移动而不变形。其中移动量由指定角度定义；如果为正值，则运动将为顺时针，如果为负值，则为逆时针。在三维空间中，旋转有三个自由度，各表示某条旋转轴。 旋转轴由 [x，y，z] 向量定义，且过原点（由 {{ cssxref("transform-origin") }} CSS 属性定义）。 如果向量没有标准化，即它的三个坐标的平方之和不是 1，它将在内部被标准化。 不可标准化的向量，如空向量 [0,0,0]，将导致旋转不被应用，但不会影响整个 CSS 属性。
+在三维空间中，旋转有三个自由度，各表示某条旋转轴。旋转轴由 [x，y，z] 向量定义，且过原点（由 {{ cssxref("transform-origin") }} CSS 属性定义）。如果向量没有标准化，即它的三个坐标的平方之和不是 1，它将在内部被标准化。不可标准化的向量，如空向量 [0,0,0]，将导致旋转不被应用，但不会影响整个 CSS 属性。
注意：相对于平面上的旋转，三维旋转的组成通常不是可交换位置顺序的，这意味着旋转的应用顺序是至关重要的。@@ -248,13 +248,13 @@参数
@@ -277,13 +277,13 @@
参数
-rotateX()
+rotateX()这个 CSS 函数定义了将元素在横坐标上旋转而不使其变形的方法。 其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。rotateX()这个 CSS 函数定义了将元素在横坐标上旋转而不使其变形的方法。其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。旋转所经过的原点，由 {{ cssxref("transform-origin") }} CSS 属性定义。.
-rotateX(a)是rotate3D(1, 0, 0, a)的简写形式。注意： 与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。+注意：与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。语法
@@ -294,7 +294,7 @@参数
@@ -317,13 +317,13 @@
参数
-rotateY()
+rotateY()这个 CSS 函数定义了将元素在纵坐标上旋转而不使其变形的方法。 其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。rotateY()这个 CSS 函数定义了将元素在纵坐标上旋转而不使其变形的方法。其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。旋转所经过的原点，由 {{ cssxref("transform-origin") }} CSS 属性定义。
-rotateY(a)是rotate3D(0, 1, 0, a)的简写形式。注意： 与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。+注意：与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。语法
@@ -334,7 +334,7 @@参数
@@ -357,7 +357,7 @@
参数
-rotateZ()
+rotateZ()这个 CSS 函数定义了将元素在 z 轴上旋转而不使其变形的方法。 其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。rotateZ()这个 CSS 函数定义了将元素在 z 轴上旋转而不使其变形的方法。其运动的程度由指定的角度来定义；如果是正的，则为顺时针旋转，如果是负的，则是逆时针旋转。旋转所经过的原点，由 {{ cssxref("transform-origin") }} CSS 属性定义。
@@ -365,7 +365,7 @@rotateZ()
-rotateZ(a)是rotate3D(0, 0, 1, a)的简写形式。注意： 与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。+注意：与平面上的旋转相反，3D 旋转的组成通常也是不可交换顺序的；这意味着旋转的应用顺序至关重要。语法
@@ -376,7 +376,7 @@参数
@@ -401,7 +401,7 @@
scale()
-
The
+scale()CSS 函数可改变元素的大小。 它可以增大或减小元素的大小，并且缩放量由矢量定义，并且它可以使在一个方向上比另一个方向更多。The
scale()CSS 函数可改变元素的大小。它可以增大或减小元素的大小，并且缩放量由矢量定义，并且它可以使在一个方向上比另一个方向更多。这种变换的特点是矢量的坐标可定义在每个不同方向上各子完成一定比例缩放。如果矢量的两个坐标相等，则缩放是均匀的或各向同性的，并且元素的形状被保留。在这种情况下，缩放函数定义了一个同调变换。
@@ -419,9 +419,9 @@参数
@@ -463,11 +463,11 @@
参数
@@ -490,7 +490,7 @@
参数
-scaleX()
+
scaleX()这个 CSS 函数是用一个常数因子来修改每个单元点的横坐标，在比例因子是 1 的情况下该函数是恒等变换。 缩放不是各向同性的，元素的角度也不守恒。 scaleX()这个 CSS 函数是用一个常数因子来修改每个单元点的横坐标，在比例因子是 1 的情况下该函数是恒等变换。缩放不是各向同性的，元素的角度也不守恒。
@@ -509,7 +509,7 @@scaleX(sx)是scale(sx, 1)和scale3d(sx, 1, 1)的简写形式。参数
@@ -538,7 +538,7 @@
scaleY()
-
+scaleY()这个 CSS 函数用一个常数因子修改每个元素点的纵坐标，在比例因子是 1 的情况下该函数是恒等变换。 缩放不是各向同性的，元素的角度不守恒。scaleY()这个 CSS 函数用一个常数因子修改每个元素点的纵坐标，在比例因子是 1 的情况下该函数是恒等变换。缩放不是各向同性的，元素的角度不守恒。
@@ -580,7 +580,7 @@scaleY(sy)是scale(1, sy)和scale3d(1, sy, 1)的简写形式。参数
-scaleZ()
+scaleZ()这个 CSS 函数是用一个常数因子来修改每个单元点的 z 轴坐标，在比例因子是 1 的情况下该函数是恒等变换。 缩放不是各向同性的，元素的角度也不守恒。scaleZ()这个 CSS 函数是用一个常数因子来修改每个单元点的 z 轴坐标，在比例因子是 1 的情况下该函数是恒等变换。缩放不是各向同性的，元素的角度也不守恒。
@@ -630,9 +630,9 @@scaleZ(sz)是scale3d(1, 1, sz)的简写形式。参数
@@ -670,7 +670,7 @@
参数
@@ -755,7 +755,7 @@
参数
@@ -784,7 +784,7 @@
参数
-translate3d()
+translate3d()这个 CSS 函数用于移动元素在 3D 空间中的位置。 这种变换的特点是三维矢量的坐标定义了它在每个方向上的移动量。translate3d()这个 CSS 函数用于移动元素在 3D 空间中的位置。这种变换的特点是三维矢量的坐标定义了它在每个方向上的移动量。语法
@@ -799,7 +799,7 @@参数
@@ -824,7 +824,7 @@
参数
-translateX()
+
translateX()这个 CSS 函数用于在平面上水平移动元素。 这个转换的特点是 {{cssxref("<length>")}} 定义了它的水平移动量。 translateX()这个 CSS 函数用于在平面上水平移动元素。这个转换的特点是 {{cssxref("<length>")}} 定义了它的水平移动量。
@@ -866,7 +866,7 @@translateX(tx)是translate(tx, 0)的简写形式。参数
-translateY()
+
translateY()这个 CSS 函数用于在平面上垂直移动元素。 这个转换的特点是通过 {{cssxref("<length>")}} 定义了它的垂直移动量。 translateY()这个 CSS 函数用于在平面上垂直移动元素。这个转换的特点是通过 {{cssxref("<length>")}} 定义了它的垂直移动量。
@@ -910,7 +910,7 @@translateY(ty)是translate(0, ty)的简写形式。参数
-translateZ()
+translateZ()这个 CSS 函数用于 3D 空间的 z 轴方向移动元素， 这个转换的特点是通过 {{cssxref("<length>")}} 定义了它的 z 轴方向移动量。translateZ()这个 CSS 函数用于 3D 空间的 z 轴方向移动元素，这个转换的特点是通过 {{cssxref("<length>")}} 定义了它的 z 轴方向移动量。
diff --git a/files/zh-cn/web/css/transform-function/perspective/index.html b/files/zh-cn/web/css/transform-function/perspective/index.html index 7b1277e6d9848f..cb213605838589 100644 --- a/files/zh-cn/web/css/transform-function/perspective/index.html +++ b/files/zh-cn/web/css/transform-function/perspective/index.html @@ -19,7 +19,7 @@translateZ(tz)是translate3d(0, 0, tz)的简写形式。参数
diff --git a/files/zh-cn/web/css/transform-function/rotate/index.html b/files/zh-cn/web/css/transform-function/rotate/index.html index f9ab3fe6188a1f..064bb20bcce161 100644 --- a/files/zh-cn/web/css/transform-function/rotate/index.html +++ b/files/zh-cn/web/css/transform-function/rotate/index.html @@ -27,7 +27,7 @@
值
diff --git a/files/zh-cn/web/css/transform-function/rotate3d/index.html b/files/zh-cn/web/css/transform-function/rotate3d/index.html index 04a555f6ff8468..40a5b477178c04 100644 --- a/files/zh-cn/web/css/transform-function/rotate3d/index.html +++ b/files/zh-cn/web/css/transform-function/rotate3d/index.html @@ -31,9 +31,9 @@
值
值
@@ -73,7 +73,7 @@
CSS
} .transformed { - /* 等同于变换: scaleX(2) scaleY(2);*/ + /* 等同于变换：scaleX(2) scaleY(2);*/ transform: scale(2); background-color: blue; } diff --git a/files/zh-cn/web/css/transform-function/scalex/index.html b/files/zh-cn/web/css/transform-function/scalex/index.html index 8957d6291a8acb..68889341ccb79a 100644 --- a/files/zh-cn/web/css/transform-function/scalex/index.html +++ b/files/zh-cn/web/css/transform-function/scalex/index.html @@ -10,7 +10,7 @@ ---{{CSSRef}}-
+scaleX()CSS 函数将每个元素点的横坐标修改为一个常数因子，除了该比例因子为 1，在这种情况下，函数是身份变换。 缩放不是各向同性的，并且元素的角度不保守。scaleX()CSS 函数将每个元素点的横坐标修改为一个常数因子，除了该比例因子为 1，在这种情况下，函数是身份变换。缩放不是各向同性的，并且元素的角度不保守。
diff --git a/files/zh-cn/web/css/transform-function/translate/index.html b/files/zh-cn/web/css/transform-function/translate/index.html index f31dd5400f791c..6032ce4721ce4c 100644 --- a/files/zh-cn/web/css/transform-function/translate/index.html +++ b/files/zh-cn/web/css/transform-function/translate/index.html @@ -11,11 +11,11 @@ ---
{{CSSRef}}-
+translate()这个 CSS 函数在水平和/或垂直方向上重新定位元素。 其结果是 {{cssxref("<transform-function>")}} 类型。translate()这个 CSS 函数在水平和/或垂直方向上重新定位元素。其结果是 {{cssxref("<transform-function>")}} 类型。
-
该变换由二维向量构成。 它的坐标定义了元素在每个方向上移动了多少。
+该变换由二维向量构成。它的坐标定义了元素在每个方向上移动了多少。
语法
@@ -34,9 +34,9 @@值
diff --git a/files/zh-cn/web/css/transform-origin/index.html b/files/zh-cn/web/css/transform-origin/index.html index 81a812c609a502..86a1795bc52ade 100644 --- a/files/zh-cn/web/css/transform-origin/index.html +++ b/files/zh-cn/web/css/transform-origin/index.html @@ -9,7 +9,7 @@ ---
{{ CSSRef }}
-
+transform-originCSS属性让你更改一个元素变形的原点。transform-originCSS 属性让你更改一个元素变形的原点。{{EmbedInteractiveExample("pages/css/transform-origin.html")}}@@ -55,7 +55,7 @@语法
transform-origin: unset; -
+transform-origin属性可以使用一个，两个或三个值来指定，其中每个值都表示一个偏移量。 没有明确定义的偏移将重置为其对应的初始值。transform-origin属性可以使用一个，两个或三个值来指定，其中每个值都表示一个偏移量。没有明确定义的偏移将重置为其对应的初始值。如果定义了两个或更多值并且没有值的关键字，或者唯一使用的关键字是
@@ -74,7 +74,7 @@center，则第一个值表示水平偏移量，第二个值表示垂直偏移量。语法
值
关键字是方便的简写方法，等同于以下{{cssxref("<percentage>")}}值：
@@ -455,5 +455,5 @@浏览器兼容
参见
diff --git a/files/zh-cn/web/css/transform/index.html b/files/zh-cn/web/css/transform/index.html index 3648c4e5fe9108..ff84378ad42fd5 100644 --- a/files/zh-cn/web/css/transform/index.html +++ b/files/zh-cn/web/css/transform/index.html @@ -9,7 +9,7 @@ ---{{CSSRef}}-CSS+transform属性允许你旋转，缩放，倾斜或平移给定元素。这是通过修改CSS视觉格式化模型的坐标空间来实现的。CSStransform属性允许你旋转，缩放，倾斜或平移给定元素。这是通过修改 CSS 视觉格式化模型的坐标空间来实现的。{{EmbedInteractiveExample("pages/css/transform.html")}}@@ -62,7 +62,7 @@值
结果
{{EmbedLiveSample("示例", "400", "160")}}
-有关更多示例，请参阅使用CSS变换和{{cssxref("<transform-function>")}}。
+有关更多示例，请参阅使用 CSS 变换和{{cssxref("<transform-function>")}}。
规范
diff --git a/files/zh-cn/web/css/transition-delay/index.html b/files/zh-cn/web/css/transition-delay/index.html index 8859c3b34ba049..b2d8a6ff90e321 100644 --- a/files/zh-cn/web/css/transition-delay/index.html +++ b/files/zh-cn/web/css/transition-delay/index.html @@ -12,11 +12,11 @@概要
-CSS的transition-delay属性规定了在过渡效果开始作用之前需要等待的时间。
+CSS 的transition-delay属性规定了在过渡效果开始作用之前需要等待的时间。
值以秒（s）或毫秒（ms）为单位，表明动画过渡效果将在何时开始。取值为正时会延迟一段时间来响应过渡效果；取值为负时会导致过渡立即开始。
-你可以指定多个延迟时间，每个延迟将会分别作用于你所指定的相符合的css属性（transition-property）
+你可以指定多个延迟时间，每个延迟将会分别作用于你所指定的相符合的 css 属性（transition-property）
{{cssinfo}}
diff --git a/files/zh-cn/web/css/transition-timing-function/index.html b/files/zh-cn/web/css/transition-timing-function/index.html index 6c84e2e9b63974..486e7b81fadc21 100644 --- a/files/zh-cn/web/css/transition-timing-function/index.html +++ b/files/zh-cn/web/css/transition-timing-function/index.html @@ -7,11 +7,11 @@概述
-CSS属性受到 transition effect的影响，会产生不断变化的中间值，而 CSS
+transition-timing-function属性用来描述这个中间值是怎样计算的。实质上，通过这个函数会建立一条加速度曲线，因此在整个transition变化过程中，变化速度可以不断改变。CSS 属性受到 transition effect的影响，会产生不断变化的中间值，而 CSS
-transition-timing-function属性用来描述这个中间值是怎样计算的。实质上，通过这个函数会建立一条加速度曲线，因此在整个 transition 变化过程中，变化速度可以不断改变。这条加速度曲线被{{cssxref("<timing-function>")}}所定义，之后作用到每个CSS属性的过渡.
+这条加速度曲线被{{cssxref("<timing-function>")}}所定义，之后作用到每个 CSS 属性的过渡.
-你可以规定多个timing function,通过使用 {{ cssxref("transition-property") }}属性，可以根据主列表(transition property的列表)给每个CSS属性应用相应的timing function.如果timing function的个数比主列表中数量少，缺少的值被设置为初始值（ease） 。如果timing function比主列表要多，timing function函数列表会被截断至合适的大小。这两种情况下声明的CSS属性都是有效的。
+你可以规定多个 timing function，通过使用 {{ cssxref("transition-property") }}属性，可以根据主列表 (transition property 的列表) 给每个 CSS 属性应用相应的 timing function.如果 timing function 的个数比主列表中数量少，缺少的值被设置为初始值（ease） 。如果 timing function 比主列表要多，timing function 函数列表会被截断至合适的大小。这两种情况下声明的 CSS 属性都是有效的。
{{cssinfo}}
@@ -39,7 +39,7 @@值
示例
diff --git a/files/zh-cn/web/css/transition/index.html b/files/zh-cn/web/css/transition/index.html index d22b46c9860f9d..0f8ee535f9da6b 100644 --- a/files/zh-cn/web/css/transition/index.html +++ b/files/zh-cn/web/css/transition/index.html @@ -47,10 +47,10 @@语法
-transition属性可以被指定为一个或多个 CSS 属性的过渡效果，多个属性之间用逗号进行分隔。每个单属性转换都描述了应该应用于单个属性的转换（或特殊值
+all和none）。 这包括：每个单属性转换都描述了应该应用于单个属性的转换（或特殊值
all和none）。这包括：-
-
- 这个关键字表示：
