From 65cc6eabd71b1bceccf6fd3d3d4970c2955f3784 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Thu, 10 Dec 2020 08:37:18 -0500 Subject: dump 2020-12-10 --- .../web/api/eventtarget/attachevent/index.html | 94 +--- files/zh-cn/web/api/idbkeyrange/index.html | 40 +- files/zh-cn/web/api/window/scrollto/index.html | 6 +- files/zh-cn/web/css/filter/index.html | 495 ++++++--------------- .../guide/css/block_formatting_context/index.html | 2 +- .../guide/expressions_and_operators/index.html | 5 +- 6 files changed, 155 insertions(+), 487 deletions(-) (limited to 'files/zh-cn/web') diff --git a/files/zh-cn/web/api/eventtarget/attachevent/index.html b/files/zh-cn/web/api/eventtarget/attachevent/index.html index 3ddf224034..41ce03185b 100644 --- a/files/zh-cn/web/api/eventtarget/attachevent/index.html +++ b/files/zh-cn/web/api/eventtarget/attachevent/index.html @@ -1,96 +1,8 @@ --- title: 为这个EventTarget附加事件. slug: Web/API/EventTarget/attachEvent +tags: + - Junk translation_of: Web/API/EventTarget/addEventListener --- -

{{APIRef("DOM Events")}}

- -

{{ Non-standard_header() }}

- -

摘要

- -

这是早期IE浏览器（IE8及早期版本）的一个专有的替代性标准，替代EventTarget.addEventListener()方法，{{domxref("EventTarget.addEventListener()")}} 方法

- -

语法

- -
attached = target.attachEvent(eventNameWithOn, callback)
-
-
- -
-
 作用的元素（target）
-
一个用于监听事件的文档对象模型元素
-
事件名伴随On（eventNameWithOn）
-
监听的事件名以on前置，类似一个属性的管理者，譬如当你使用onclick时能够监听你的click事件
-
回调函数
-
当目标触发事件时回调函数被调用。这个函数被调用时不带参数，并且这些都将设置在window object.这个对象中
-
附加
-
    是否成功附加上属性会以布尔值表示
-
- -

规范

- -

不存在于任何标准规范中

- -

微软在MSDN有详细描述 has a description on MSDN.

- -

浏览器是否合适

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{ CompatNo() }}{{ CompatNo() }}6 thru 10 [1]{{ CompatUnknown() }}{{ CompatNo() }}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{ CompatNo() }}{{ CompatNo() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatNo() }}
-
- -

[1]: attachEvent() 不再被IE11支持。

- -

{{domxref("EventTarget.addEventListener()")}}被IE9+支持.

- -

See also

- - +

{{DOMxRef("EventTarget.addEventListener","EventTarget.addEventListener()")}}

diff --git a/files/zh-cn/web/api/idbkeyrange/index.html b/files/zh-cn/web/api/idbkeyrange/index.html index 32481c3a02..af65cfbb11 100644 --- a/files/zh-cn/web/api/idbkeyrange/index.html +++ b/files/zh-cn/web/api/idbkeyrange/index.html @@ -16,10 +16,10 @@ translation_of: Web/API/IDBKeyRange

{{APIRef("IndexedDB")}}

-

The IDBKeyRange interface of the IndexedDB API represents a continuous interval over some data type that is used for keys. Records can be retrieved from {{domxref("IDBObjectStore")}} and {{domxref("IDBIndex")}} objects using keys or a range of keys. You can limit the range using lower and upper bounds. For example, you can iterate over all values of a key in the value range A–Z.

+

IndexedDB API 的IDBKeyRange接口表示一些数据类型上的键的连续间隔。可以使用一个键或某个范围的键从{{domxref("IDBObjectStore")}} 和{{domxref("IDBIndex")}} 对象中检索记录。您也可以指定键的上界和下界来限制范围。例如，您可以遍历值范围a - z中的键的所有值。

-

A key range can be a single value or a range with upper and lower bounds or endpoints. If the key range has both upper and lower bounds, then it is bounded; if it has no bounds, it is unbounded. A bounded key range can either be open (the endpoints are excluded) or closed (the endpoints are included). To retrieve all keys within a certain range, you can use the following code constructs:

+

键范围可以是单个值，也可以是具有上界、下界或端点的范围。如果键范围同时有上界或下界，那么它是有界的，否则是无界的。有界键范围可以是开放的（不包含端点）或闭合的（包含了端点）。要检索一定范围内的所有键值，可以使用以下的代码结构：

@@ -66,21 +66,21 @@ translation_of: Web/API/IDBKeyRange
-

A key is in a key range if the following conditions are true:

+

如果以下条件为true，则键包含在键范围中:

@@ -91,13 +91,13 @@ translation_of: Web/API/IDBKeyRange
{{domxref("IDBKeyRange.lower")}} {{readonlyInline}}
-
Lower bound of the key range.
+
键范围的下界
{{domxref("IDBKeyRange.upper")}} {{readonlyInline}}
-
Upper bound of the key range.
+
键范围的上界
{{domxref("IDBKeyRange.lowerOpen")}} {{readonlyInline}}
-
Returns false if the lower-bound value is included in the key range.
+
如果下界值包含在键范围内，则返回false。
{{domxref("IDBKeyRange.upperOpen")}} {{readonlyInline}}
-
Returns false if the upper-bound value is included in the key range.
+
如果上界值包含在键范围内，则返回false。

Methods

@@ -106,31 +106,31 @@ translation_of: Web/API/IDBKeyRange
{{domxref("IDBKeyRange.bound()")}}
-
Creates a new key range with upper and lower bounds.
+
指定上界和下界来创建一个新的键范围
{{domxref("IDBKeyRange.only()")}}
-
Creates a new key range containing a single value.
+
指定单个键值来创建一个新的键范围
{{domxref("IDBKeyRange.lowerBound()")}}
-
Creates a new key range with only a lower bound.
+
指定结果集的下界来创建一个新的键范围
{{domxref("IDBKeyRange.upperBound()")}}
-
Creates a new upper-bound key range.
+
指定结果集的上界来创建一个新的键范围

Instance methods

{{domxref("IDBKeyRange.includes()")}}
-
Returns a boolean indicating whether a specified key is inside the key range.
+
返回一个布尔值来表示指定的键是否在键范围内。

Examples

-

The following example illustrates how you'd use a key range. Here we declare a keyRangeValue as a range between values of "A" and "F". We open a transaction (using {{domxref("IDBTransaction")}}) and an object store, and open a Cursor with {{domxref("IDBObjectStore.openCursor")}}, declaring keyRangeValue as its optional key range value. This means that the cursor will only retrieve records with keys inside that range. This range includes the values "A" and "F", as we haven't declared that they should be open  bounds. If we used IDBKeyRange.bound("A", "F", true, true);, then the range would not include "A" and "F", only the values between them.

+

以下示例用以说明该如果使用键范围。在此我们将 keyRangeValue 声明为A～F之间的范围。我们打开一个事务 (使用 {{domxref("IDBTransaction")}}) 和一个对象存储, 并用 {{domxref("IDBObjectStore.openCursor")}}打开一个游标，其中keyRangeValue是一个可选的键范围值，指定之后游标将只检索键在该范围内的记录。这里的键范围包括了“A”和“F”，因为我们还没声明键范围为开放边界。如果我们使用 IDBKeyRange.bound("A", "F", true, true);，那么这个键范围将不包括“A”和“F”，只包含它们之间的值。

Note: For a more complete example allowing you to experiment with key range, have a look at our IDBKeyRange-example repo (view the example live too.)

-
function displayData() {
+
function displayData() {
   var keyRangeValue = IDBKeyRange.bound("A", "F");
 
   var transaction = db.transaction(['fThings'], 'readonly');
diff --git a/files/zh-cn/web/api/window/scrollto/index.html b/files/zh-cn/web/api/window/scrollto/index.html
index 715e3f0190..83cc7657aa 100644
--- a/files/zh-cn/web/api/window/scrollto/index.html
+++ b/files/zh-cn/web/api/window/scrollto/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/Window/scrollTo
 
 
语法

 
-
window.scrollTo(x-coord,y-coord )
+
window.scrollTo(x-coord,y-coord )
 
 window.scrollTo(options)

 
@@ -26,7 +26,7 @@ translation_of: Web/API/Window/scrollTo
 
    
  
  1. top 等同于  y-coord
    2. 
  
  2. left 等同于  x-coord
    3. 
- 
  3. behavior  类型String,表示滚动行为,支持参数 smooth(平滑滚动),instant(瞬间滚动),默认值auto,实测效果等同于instant
    4. 
+ 
  4. behavior  类型String,表示滚动行为,支持参数 smooth(平滑滚动),instant(瞬间滚动),默认值auto
    5. 
 

 
 

@@ -34,7 +34,7 @@ translation_of: Web/API/Window/scrollTo
 
 
例子

 
-
window.scrollTo( 0, 1000 );
+
window.scrollTo( 0, 1000 );
 
 // 设置滚动行为改为平滑的滚动
 window.scrollTo({
diff --git a/files/zh-cn/web/css/filter/index.html b/files/zh-cn/web/css/filter/index.html
index 0bb84948cb..4b8ab9fcdb 100644
--- a/files/zh-cn/web/css/filter/index.html
+++ b/files/zh-cn/web/css/filter/index.html
@@ -10,9 +10,9 @@ translation_of: Web/CSS/filter
 ---
 
{{CSSRef}}

 
-
filter CSS属性将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。

+
filter CSS属性将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。

 
-
CSS标准里包含了一些已实现预定义效果的函数。你也可以参考一个SVG滤镜，通过一个URL链接到SVG滤镜元素(SVG filter element)。

+
CSS 标准里包含了一些已实现预定义效果的函数。你也可以参考一个 SVG 滤镜，通过一个 URL 链接到 SVG 滤镜元素(SVG filter element)。

 
 
{{EmbedInteractiveExample("pages/css/filter.html")}}

 
@@ -20,7 +20,7 @@ translation_of: Web/CSS/filter
 
 
语法

 
-
/* URL to SVG filter */
+
/* URL to SVG filter */
 filter: url("filters.svg#filter-id");
 
 /* <filter-function> values */
@@ -38,247 +38,84 @@ filter: sepia(60%);
 /* Multiple filters */
 filter: contrast(175%) brightness(3%);
 
+/* Use no filter */
+filter: none;
+
 /* Global values */
 filter: inherit;
 filter: initial;
-filter: unset;
-

+filter: unset;

 
 
设置一种函数，方法如下：

 
-
filter: <filter-function> [<filter-function>]* | none
+
filter: <filter-function> [<filter-function>]* | none
 

 
-
给SVG元素 {{ SVGElement("filter") }}引用滤镜, 如下：

+
给SVG元素 {{SVGElement("filter")}} 引用滤镜, 如下：

 
-
filter: url(svg-url#element-id)
-

+
filter: url(file.svg#filter-element-id)

 
 
插值

 
-
如果起始和结束过滤器都有一个不含{{cssxref("<url>")}}的相同长度的函数列表，则会根据其指定的规则对其每个过滤器函数进行插值。如果它们的长度不同，较长列表中确实的等效过滤器函数将使用空白的值添加到较短列表的尾部，然后所有的过滤器函数根据其特定的规则插值。如果一个过滤器是none则会使用过滤器函数的默认值替换函数列表，然后根据特定的规则进行插值，否则使用离散插值。

-
-
形式语法

-
-
{{csssyntax}}

-
-
实例

-
-
下面的例子是使用预设的滤镜函数。每个函数都有特定的例子.

-
-
.mydiv { filter: grayscale(50%) }
-
-/* gray all images by 50% and blur by 10px */
-img {
-  filter: grayscale(0.5) blur(10px);
-}

-
-
下面的例子展示：通过url函数引入一个svg资源.

-
-
.target { filter: url(#c1); }
-
-.mydiv { filter: url(commonfilters.xml#large-blur) }
-

+
如果起始和结束过滤器都有一个不含 {{cssxref("<url>")}} 的相同长度的函数列表，则会根据其指定的规则对其每个过滤器函数进行插值。如果它们的长度不同，较长列表中确实的等效过滤器函数将使用空白的值添加到较短列表的尾部，然后所有的过滤器函数根据其特定的规则插值。如果一个过滤器是none则会使用过滤器函数的默认值替换函数列表，然后根据特定的规则进行插值，否则使用离散插值。

 
 
函数

 
-
使用CSS滤镜属性，你需要设定下面某一函数的值。如果该值无效，函数返回“none“。除特殊说明外，函数的值如果接受百分比值（如34%），那么该函数也接受小数值（如0.34）。

+
使用 CSS 滤镜属性，你需要设定下面某一函数的值。如果该值无效，函数返回 none。除特殊说明外，函数的值如果接受百分比值（如 34%），那么该函数也接受小数值（如0.34）。

 
-
url()

+
当单个 filter 属性具有两个或多个函数时，其结果将与将两个或多个 filter 属性分别应用于相同的函数时的结果不同

 
-
URL函数接受一个XML文件，该文件设置了 一个SVG滤镜，且可以包含一个锚点来指定一个具体的滤镜元素.

+
SVG filter

 
-
filter: url(resources.svg#c1)
-

+
url()

 
-
blur()

+
获取指向SVG过滤器的URI，该 SVG filter 可以嵌入到外部XML文件中。

 
-
给图像设置高斯模糊。“radius”一值设定高斯函数的标准差，或者是屏幕上以多少像素融在一起，所以值越大越模糊；如果没有设定值，则默认是0；这个参数可设置css长度值，但不接受百分比值。

+
filter: url(resources.svg#c1)

 
-
filter: blur(5px)
-

+
Filter 函数

 
-
 
-
<svg height="0" xmlns="http://www.w3.org/2000/svg">
+
<svg style="position: absolute; top: -99999px" xmlns="http://www.w3.org/2000/svg">
   <filter id="svgBlur" x="-5%" y="-5%" width="110%" height="110%">
     <feGaussianBlur in="SourceGraphic" stdDeviation="5"/>
   </filter>
 </svg>

 
-
{{EmbedLiveSample('blur_example','100%','236px','')}}

+
{{EmbedLiveSample('blur_example','100%','236px','','', 'no-codepen')}}

 
-
brightness()

+
brightness()

 
-
给图片应用一种线性乘法，使其看起来更亮或更暗。如果值是0%，图像会全黑。值是100%，则图像无变化。其他的值对应线性乘数效果。值超过100%也是可以的，图像会比原来更亮。如果没有设定值，默认是1。

+
{{cssxref("filter-function/brightness", "brightness()")}} 函数将线性乘法器应用于输入图像，使其看起来或多或少地变得明亮。值为 0％ 将创建全黑图像。值为 100％ 会使输入保持不变。其他值是效果的线性乘数。如果值大于 100% 提供更明亮的结果。若没有设置值，默认为 1。

 
-
filter: brightness(0.5)

+
filter: brightness(2)

 
-
<svg height="0" xmlns="http://www.w3.org/2000/svg">
- <filter id="brightness">
+
<svg style="position: absolute; top: -99999px" xmlns="http://www.w3.org/2000/svg">
+  <filter id="brightness">
     <feComponentTransfer>
-        <feFuncR type="linear" slope="[amount]"/>
-        <feFuncG type="linear" slope="[amount]"/>
-        <feFuncB type="linear" slope="[amount]"/>
+      <feFuncR type="linear" slope="[amount]"/>
+      <feFuncG type="linear" slope="[amount]"/>
+      <feFuncB type="linear" slope="[amount]"/>
     </feComponentTransfer>
   </filter>
 </svg>

 
-
-
-
{{EmbedLiveSample('brightness_example','100%','231px','')}}

+
contrast()

 
-
contrast()

+
{{cssxref("filter-function/contrast", "contrast()")}} 函数可调整输入图像的对比度。值是 0% 的话，图像会全黑。值是 100%，图像不变。值可以超过 100%，意味着会运用更低的对比。若没有设置值，默认是 1。

 
-
调整图像的对比度。值是0%的话，图像会全黑。值是100%，图像不变。值可以超过100%，意味着会运用更低的对比。若没有设置值，默认是1。

-
-
filter: contrast(200%)
+
filter: contrast(200%)
 

 
-
<svg height="0" xmlns="http://www.w3.org/2000/svg">
+
<svg height="0" xmlns="http://www.w3.org/2000/svg">
   <filter id="contrast">
     <feComponentTransfer>
       <feFuncR type="linear" slope="[amount]" intercept="-(0.5 * [amount]) + 0.5"/>
@@ -290,7 +127,7 @@ table.standard-table td {
 

 
 
 
-
{{EmbedLiveSample('contrast_example','100%','203px','')}}

+
{{EmbedLiveSample('contrast_example','100%','203px','','', 'no-codepen')}}

 
-
drop-shadow()

+
drop-shadow()

 
-
给图像设置一个阴影效果。阴影是合成在图像下面，可以有模糊度的，可以以特定颜色画出的遮罩图的偏移版本。 函数接受<shadow>（在CSS3背景中定义）类型的值，除了“inset”关键字是不允许的。该函数与已有的box-shadow {{cssxref("box-shadow")}}属性很相似；不同之处在于，通过滤镜，一些浏览器为了更好的性能会提供硬件加速。 <shadow>参数如下：

+
{{cssxref("filter-function/drop-shadow", "drop-shadow()")}} 函数对输入图像应用阴影效果。阴影可以设置模糊度的，以特定颜色画出的遮罩图的偏移版本，最终合成在图像下面。 函数接受<shadow>（在CSS3背景中定义）类型的值，除了 inset 和 spread 关键字。该函数与已有的 {{cssxref("box-shadow")}} 属性很相似；不同之处在于，通过滤镜，一些浏览器为了更好的性能会提供硬件加速。<shadow> 参数如下：

 
 

  
<offset-x> <offset-y> (必须)

- 
这是设置阴影偏移量的两个 {{cssxref("<length>")}}值. <offset-x> 设定水平方向距离. 负值会使阴影出现在元素左边. <offset-y>设定垂直距离.负值会使阴影出现在元素上方。.查看 {{cssxref("<length>")}}可能的单位.

- 如果两个值都是0, 则阴影出现在元素正后面 (如果设置了 <blur-radius> and/or <spread-radius>，会有模糊效果).

+ 
这是设置阴影偏移量的两个 {{cssxref("<length>")}} 值。 <offset-x> 设定水平方向距离，负值会使阴影出现在元素左边。 <offset-y>设定垂直距离，负值会使阴影出现在元素上方。查看 {{cssxref("<length>")}} 了解可能的单位.

+ 如果两个值都是 0, 则阴影出现在元素正后面 (如果设置了 <blur-radius> 且/或 <spread-radius> 也会有模糊效果).

  
<blur-radius> (可选)

- 
这是第三个 {{cssxref("<length>")}}值. 值越大，越模糊，则阴影会变得更大更淡.不允许负值 若未设定，默认是0 (则阴影的边界很锐利).

- 
<spread-radius> (可选)

- 
这是第四个 {{cssxref("<length>")}} 值. 正值会使阴影扩张和变大，负值会是阴影缩小.若未设定，默认是0 (阴影会与元素一样大小). 

- 注意: Webkit, 以及一些其他浏览器 不支持第四个长度，如果加了也不会渲染。

+ 
这是第三个 {{cssxref("<length>")}} 值。值越大，越模糊，所以阴影可以变得更大或更淡。不允许负值。若未设定，默认是 0 (则阴影的边界很锐利)。

  
<color> (可选)

- 
查看 {{cssxref("<color>")}}该值可能的关键字和标记。若未设定，颜色值基于浏览器。在Gecko (Firefox), Presto (Opera)和Trident (Internet Explorer)中， 会应用 {{ cssxref("color") }}属性的值。另外，如果颜色值省略，WebKit中阴影是透明的。

+ 
查看 {{cssxref("<color>")}} 了解该值可能的关键字和标记。若未设定，颜色值基于浏览器 —— 通常是 {{cssxref("<color>")}} 属性的值，但请注意，在这种情况下，Safari 当前会绘制透明阴影。在 Gecko (Firefox), Presto (Opera) 和 Trident (Internet Explorer) 中， 会应用 {{cssxref("<color>")}} 属性的值。另外，如果颜色值省略，WebKit 中阴影是透明的。

 

 
-
filter: drop-shadow(16px 16px 10px black)

+
filter: drop-shadow(16px 16px 10px black)

 
-
<svg height="0" xmlns="http://www.w3.org/2000/svg">
+
<svg style="position: absolute; top: -999999px" xmlns="http://www.w3.org/2000/svg">
  <filter id="drop-shadow">
     <feGaussianBlur in="SourceAlpha" stdDeviation="[radius]"/>
     <feOffset dx="[offset-x]" dy="[offset-y]" result="offsetblur"/>
@@ -397,129 +231,18 @@ table.standard-table td {
       <feMergeNode in="SourceGraphic"/>
     </feMerge>
   </filter>
-</svg>
-

-
-
+</svg>

 
-
{{EmbedLiveSample('shadow_example','100%','300px','')}}

+
{{EmbedLiveSample('shadow_example','100%','300px','','', 'no-codepen')}}

 
-
grayscale()

+
grayscale()

 
-
将图像转换为灰度图像。值定义转换的比例。值为100%则完全转为灰度图像，值为0%图像无变化。值在0%到100%之间，则是效果的线性乘子。若未设置，值默认是0。

+
{{cssxref("filter-function/grayscale", "grayscale()")}}  函数将改变输入图像灰度。amount 的值定义了转换的比例。值为 100% 则完全转为灰度图像，值为 0% 图像无变化。值在 0% 到 100% 之间，则是效果的线性乘数。若未设置值，默认是 0。

 
-
filter: grayscale(100%)

+
filter: grayscale(100%)

 
 
 
-
{{EmbedLiveSample('grayscale_example','100%','209px','')}}

+
{{EmbedLiveSample('grayscale_example','100%','209px','','', 'no-codepen')}}

 
-
hue-rotate()

+
hue-rotate()

 
-
给图像应用色相旋转。“angle”一值设定图像会被调整的色环角度值。值为0deg，则图像无变化。若值未设置，默认值是0deg。该值虽然没有最大值，超过360deg的值相当于又绕一圈。

+
{{cssxref("filter-function/hue-rotate", "hue-rotate()")}} 函数在输入图像上应用色相旋转。angle 一值设定图像会被调整的色环角度值。值为 0deg，则图像无变化。若值未设置值，默认为 0deg。该值虽然没有最大值，超过 360deg 的值相当于又绕一圈。

 
-
filter: hue-rotate(90deg)

+
filter: hue-rotate(90deg)

+
+
<svg style="position: absolute; top: -999999px" xmlns="http://www.w3.org/2000/svg">
+  <filter id="svgHueRotate" >
+    <feColorMatrix type="hueRotate" values="[angle]" />
+  <filter />
+</svg>

 
 
 
-
{{EmbedLiveSample('huerotate_example','100%','221px','')}}

+
{{EmbedLiveSample('huerotate_example','100%','221px','','', 'no-codepen')}}

 
-
invert()

+
invert()

 
-
反转输入图像。值定义转换的比例。100%的价值是完全反转。值为0%则图像无变化。值在0%和100%之间，则是效果的线性乘子。 若值未设置，值默认是0。

+
{{cssxref("filter-function/invert", "invert()")}} 函数反转输入图像。amount 的值定义转换的比例。100% 的价值是完全反转。值为 0% 则图像无变化。值在 0% 和 100% 之间，则是效果的线性乘数。 若值未设置值，默认为 0。

 
-
filter: invert(100%)

+
filter: invert(100%)

 
 
 
-
{{EmbedLiveSample('invert_example','100%','407px','')}}

+
{{EmbedLiveSample('invert_example','100%','407px','','', 'no-codepen')}}

 
-
opacity()

+
opacity()

 
-
转化图像的透明程度。值定义转换的比例。值为0%则是完全透明，值为100%则图像无变化。值在0%和100%之间，则是效果的线性乘子，也相当于图像样本乘以数量。 若值未设置，值默认是1。该函数与已有的opacity属性很相似，不同之处在于通过filter，一些浏览器为了提升性能会提供硬件加速。

+
{{cssxref("filter-function/opacity", "opacity()")}}  转化图像的透明程度。amount 的值定义转换的比例。值为 0% 则是完全透明，值为 100% 则图像无变化。值在 0% 和 100% 之间，则是效果的线性乘数。也相当于图像样本乘以数量。 若值未设置，值默认是1。该函数与已有的 opacity 属性很相似，不同之处在于通过 filter，一些浏览器为了提升性能会提供硬件加速。

 
-
filter: opacity(50%)

+
filter: opacity(50%)

 
 
 
-
{{EmbedLiveSample('opacity_example','100%','210px','')}}

+
{{EmbedLiveSample('opacity_example','100%','210px','','', 'no-codepen')}}

 
-
saturate()

+
saturate()

 
-
转换图像饱和度。值定义转换的比例。值为0%则是完全不饱和，值为100%则图像无变化。其他值，则是效果的线性乘子。超过100%的值是允许的，则有更高的饱和度。 若值未设置，值默认是1。

+
{{cssxref("filter-function/saturate", "saturate()")}} 函数转换图像饱和度。amount 的值定义转换的比例。值为 0% 则是完全不饱和，值为 100% 则图像无变化。其他值是效果的线性乘数。超过 100% 则有更高的饱和度。 若未设置值，默认为 1。

 
-
filter: saturate(200%)

+
filter: saturate(200%)

 
 
 
-
{{EmbedLiveSample('saturate_example','100%','332px','')}}

+
{{EmbedLiveSample('saturate_example','100%','332px','','', 'no-codepen')}}

 
-
sepia()

+
sepia()

 
-
将图像转换为深褐色。值定义转换的比例。值为100%则完全是深褐色的，值为0%图像无变化。值在0%到100%之间，则是效果的线性乘子。若未设置，值默认是0。

+
 {{cssxref("filter-function/sepia", "sepia()")}} 函数将图像转换为深褐色。amount 的值定义转换的比例。值为 100% 则完全是深褐色的，值为 0% 图像无变化。值在 0% 到 100% 之间，值是效果的线性乘数。若未设置，值默认是 0。

 
-
filter: sepia(100%)

+
filter: sepia(100%)

 
 
 
-
{{EmbedLiveSample('sepia_example','100%','229px','')}}

+
{{EmbedLiveSample('sepia_example','100%','229px','','', 'no-codepen')}}

 
 
复合函数

 
 
你可以组合任意数量的函数来控制渲染。下面的例子可以增强图像的对比度和亮度。

 
-
filter: contrast(175%) brightness(3%)

+
filter: contrast(175%) brightness(3%)

 
 
 
-
{{EmbedLiveSample('combination_example','100%','209px','')}}

+
{{EmbedLiveSample('combination_example','100%','209px','','', 'no-codepen')}}

+
+
正式定义

+
+
{{cssinfo}}

+
+
形式语法

+
+
{{csssyntax}}

+
+
示例

+
+
应用 filter 功能

+
+
下面显示了使用预定义功能的示例。有关特定示例，请参见每个功能。

+
+
.mydiv { filter: grayscale(50%) }
+
+/* gray all images by 50% and blur by 10px */
+img {
+  filter: grayscale(0.5) blur(10px);
+}

+
+
应用 SVG filter

+
+
将 URL 函数与 SVG 资源一起使用的示例如下：

+
+
.target { filter: url(#c1); }
+
+.mydiv { filter: url(commonfilters.xml#large-blur) }
+

 
 
规范

 
@@ -1101,8 +860,6 @@ table.standard-table td {
  
 
 
-
{{cssinfo}}

-
 
浏览器兼容性

 
 
{{Compat("css.properties.filter")}}

diff --git a/files/zh-cn/web/guide/css/block_formatting_context/index.html b/files/zh-cn/web/guide/css/block_formatting_context/index.html
index 04ccc3bedb..740c8186d5 100644
--- a/files/zh-cn/web/guide/css/block_formatting_context/index.html
+++ b/files/zh-cn/web/guide/css/block_formatting_context/index.html
@@ -22,7 +22,7 @@ translation_of: Web/Guide/CSS/Block_formatting_context
  
  • 表格单元格（元素的 {{ cssxref("display") }} 为 table-cell，HTML表格单元格默认为该值）
    • 
  
  • 表格标题（元素的 {{ cssxref("display") }} 为 table-caption，HTML表格标题默认为该值）
    • 
  
  • 匿名表格单元格元素（元素的 {{ cssxref("display") }} 为 table、table-row、 table-row-group、table-header-group、table-footer-group（分别是HTML table、row、tbody、thead、tfoot 的默认属性）或 inline-table）
    • 
- 
  • {{ cssxref("overflow") }} 值不为 visible 的块元素
    • 
+ 
  • {{ cssxref("overflow") }} 计算值(Computed)不为 visible 的块元素
    • 
  
  • {{ cssxref("display") }} 值为 flow-root 的元素
    • 
  
  • {{ cssxref("contain") }} 值为 layout、content 或 paint 的元素
    • 
  
  • 弹性元素（{{ cssxref("display") }} 为 flex 或 inline-flex 元素的直接子元素）
    • 
diff --git a/files/zh-cn/web/javascript/guide/expressions_and_operators/index.html b/files/zh-cn/web/javascript/guide/expressions_and_operators/index.html
index b7e809269d..256961d4e6 100644
--- a/files/zh-cn/web/javascript/guide/expressions_and_operators/index.html
+++ b/files/zh-cn/web/javascript/guide/expressions_and_operators/index.html
@@ -594,10 +594,9 @@ for (var i = 0, j = 9; i <= j; i++, j--)
 
 
    delete
    
 
-
    delete操作符，删除一个对象或一个对象的属性或者一个数组中某一个键值。语法如下:
    
+
    delete操作符，删除一个对象的属性或者一个数组中某一个键值。语法如下:
    
 
-
    delete objectName;
-delete objectName.property;
+
    delete objectName.property;
 delete objectName[index];
 delete property; // legal only within a with statement
 
    
-- 
cgit v1.2.3-54-g00ecf