Skip to content

Commit 9b65d61

Browse files
committed
fix w3c#253
1 parent b518494 commit 9b65d61

1 file changed

Lines changed: 29 additions & 29 deletions

File tree

compositing-1/Overview.bs

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ all properties defined in this specification also accept the <a
6565
href="https://www.w3.org/TR/CSS21/cascade.html#value-def-inherit">inherit</a>
6666
keyword as their property value. For readability it has not been repeated
6767
explicitly.
68-
68+
6969
<h2 id="csscompositingandblending">Specifying Blending in CSS </h2>
7070
<h3 id="compositingandblendingorder">Order of graphical operations</h3>
7171

@@ -118,7 +118,7 @@ Animatable: no
118118
The syntax of the property of <<blend-mode>> is given with:
119119

120120
<pre class="blendmode"><dfn id="ltblendmodegt">&lt;blend-mode></dfn> = <a value>normal</a> | <a value>multiply</a> | <a value>screen</a> | <a value>overlay</a> | <a value>darken</a> | <a value>lighten</a> | <a value>color-dodge</a> |
121-
<a value>color-burn</a> | <a value>hard-light</a> | <a value>soft-light</a> | <a value>difference</a> | <a value>exclusion</a> | <a value>hue</a> |
121+
<a value>color-burn</a> | <a value>hard-light</a> | <a value>soft-light</a> | <a value>difference</a> | <a value>exclusion</a> | <a value>hue</a> |
122122
<a value>saturation</a> | <a value>color</a> | <a value>luminosity</a></pre>
123123

124124
Note: Applying a blendmode other than <a value>normal</a> to the element must establish a new <a spec="css21">stacking context</a> [[!CSS21]]. This group must then be blended and composited with the <a spec="css21">stacking context</a> that contains the element.
@@ -227,7 +227,7 @@ div { background-image: url('texture.png'); }
227227
}
228228
p {
229229
mix-blend-mode: overlay;
230-
font-family: "Mythos Std"
230+
font-family: "Mythos Std"
231231
}
232232
</pre>
233233

@@ -302,7 +302,7 @@ property for that element must be reset to its initial value.
302302
<p>And the following style rule:</p>
303303
<pre>
304304
body { background-color: lime; }
305-
div {
305+
div {
306306
width: 200px;
307307
height: 200px;
308308
background-size: 200px 200px;
@@ -363,7 +363,7 @@ Where the graphic element is opaque, it obscures the backdrop and where the grap
363363
-->
364364

365365
In the model described in this specification there are two steps to the overall compositing operation - <a href="#advancedcompositing">Porter-Duff compositing</a> and <a href="#blending">blending</a>.
366-
<!--Porter Duff compositing takes into account the overall shape of the graphic element and its opacity, as well as the opacity and shape of the backdrop, and
366+
<!--Porter Duff compositing takes into account the overall shape of the graphic element and its opacity, as well as the opacity and shape of the backdrop, and
367367
determines where the backdrop is visible, where the graphic element is visible and where one is visible through the other.-->
368368
The blending step determines how the colors from the graphic element and the backdrop interact.
369369

@@ -385,7 +385,7 @@ The formula for simple alpha compositing is
385385
co = Cs x αs + Cb x αb x (1 - αs)
386386
</pre>
387387

388-
Where
388+
Where
389389

390390
<ul>
391391
<li>co: the premultiplied pixel value after compositing
@@ -400,10 +400,10 @@ Note: All values are between 0 and 1 inclusive.
400400
The pixel value after compositing (co) is given by adding the contributions from the source graphic element [Cs x αs] and the backdrop [Cb x αb x (1 - αs)].
401401
For both the graphic element and the backdrop, the color values are multiplied by the alpha to determine the amount of color that contributes.
402402
With zero alpha meaning that the color does not contribute and partial alpha means that some percentage of the color contributes.
403-
The contribution of the backdrop is further reduced based on the opacity of the graphic element.
403+
The contribution of the backdrop is further reduced based on the opacity of the graphic element.
404404
Conceptually, (1 - αs) of the backdrop shows through the graphic element, meaning that if the graphic element is fully opaque (αs=1) then no backdrop shows through.
405405

406-
The simple alpha compositing formula listed above gives a resultant color which is the result of the
406+
The simple alpha compositing formula listed above gives a resultant color which is the result of the
407407
weighted average of the backdrop color and graphic element color, with the weighting determined by the backdrop and
408408
graphic element alphas.
409409
The resultant alpha value of the composite is simply the sum of the contributed alpha of the composited elements.
@@ -413,7 +413,7 @@ The formula for the resultant alpha of the composite is
413413
αo = αs + αb x (1 - αs)
414414
</pre>
415415

416-
Where
416+
Where
417417

418418
<ul>
419419
<li>αo: the alpha value of the composite
@@ -429,7 +429,7 @@ The pre-multiplied value is given by
429429
<pre>
430430
cs = Cs x αs
431431
</pre>
432-
with
432+
with
433433
<ul>
434434
<li>cs: the pre-multiplied value
435435
<li>Cs: the color value
@@ -770,7 +770,7 @@ The area of each region can be calculated with the following equations:
770770
The figure above represents coverage of 0.5 for both source and destination.
771771

772772
<pre>
773-
Both = 0.5 x 0.5 = 0.25
773+
Both = 0.5 x 0.5 = 0.25
774774
Source Only = 0.5 (1 – 0.5) = 0.25
775775
Destination Only = 0.5(1 – 0.5) = 0.25
776776
None = (1 – 0.5)(1 – 0.5) = 0.25
@@ -901,7 +901,7 @@ Destination which overlaps the source, replaces the source.
901901
</div>
902902
<pre>
903903
Fa = 0; Fb = αs
904-
co = αb x Cb x αs
904+
co = αb x Cb x αs
905905
αo = αb x αs
906906
</pre>
907907

@@ -988,8 +988,8 @@ Display the sum of the source image and destination image. It is defined in the
988988
<!--<h4 id="groupcompositingisolation">Isolated groups and Porter Duff modes</h4>-->
989989

990990
When compositing the elements within an isolated group, the elements are composited over a transparent black initial backdrop. If the bottom element in the group uses a Porter Duff compositing operator
991-
which is dependent on the backdrop, such as <a href="#porterduffcompositingoperators_dst">destination</a>, <a href="#porterduffcompositingoperators_srcin">source-in</a>,
992-
<a href="#porterduffcompositingoperators_dstin">destination-in</a>, <a href="#porterduffcompositingoperators_dstout">destination-out</a> or <a href="#porterduffcompositingoperators_srcatop">source-atop</a>,
991+
which is dependent on the backdrop, such as <a href="#porterduffcompositingoperators_dst">destination</a>, <a href="#porterduffcompositingoperators_srcin">source-in</a>,
992+
<a href="#porterduffcompositingoperators_dstin">destination-in</a>, <a href="#porterduffcompositingoperators_dstout">destination-out</a> or <a href="#porterduffcompositingoperators_srcatop">source-atop</a>,
993993
then the result of the composite will be empty. Subsequent elements within the group are composited with the result of the first composite.
994994

995995
<!--
@@ -1103,7 +1103,7 @@ This is the default attribute which specifies no blending. The blending formula
11031103

11041104
<h4 id="blendingmultiply"><dfn dfn-type="value" dfn-for="<blend-mode>">multiply</dfn> blend mode</h4>
11051105

1106-
The source color is multiplied by the destination color and replaces the destination.
1106+
The source color is multiplied by the destination color and replaces the destination.
11071107

11081108
The resultant color is always at least as dark as either the source or destination color. Multiplying any color with black results in black. Multiplying any color with white preserves the original color.
11091109

@@ -1224,7 +1224,7 @@ Multiplies or screens the colors, depending on the source color value. The effec
12241224
if(Cs <= 0.5)
12251225
B(Cb, Cs) = Multiply(Cb, 2 x Cs)
12261226
else
1227-
B(Cb, Cs) = Screen(Cb, 2 x Cs -1)
1227+
B(Cb, Cs) = Screen(Cb, 2 x Cs -1)
12281228
</pre>
12291229

12301230
See the definition of <a value>multiply</a> and <a value>screen</a> for their formulas.
@@ -1298,28 +1298,28 @@ The nonseparable blend mode formulas make use of several auxiliary functions:
12981298

12991299
<pre>
13001300
Lum(C) = 0.3 x Cred + 0.59 x Cgreen + 0.11 x Cblue
1301-
1301+
13021302
ClipColor(C)
13031303
L = Lum(C)
13041304
n = min(Cred, Cgreen, Cblue)
13051305
x = max(Cred, Cgreen, Cblue)
13061306
if(n < 0)
1307-
C = L + (((C - L) * L) / (L - n))
1308-
1307+
C = L + (((C - L) × L) / (L - n))
1308+
13091309
if(x > 1)
1310-
C = L + (((C - L) * (1 - L)) / (x - L))
1311-
1310+
C = L + (((C - L) × (1 - L)) / (x - L))
1311+
13121312
return C
1313-
1313+
13141314
SetLum(C, l)
13151315
d = l - Lum(C)
13161316
Cred = Cred + d
13171317
Cgreen = Cgreen + d
13181318
Cblue = Cblue + d
13191319
return ClipColor(C)
1320-
1320+
13211321
Sat(C) = max(Cred, Cgreen, Cblue) - min(Cred, Cgreen, Cblue)
1322-
1322+
13231323
The subscripts min, mid, and max in the next function refer to the color
13241324
components having the minimum, middle, and maximum values upon entry to the function.
13251325

@@ -1409,8 +1409,8 @@ If this rule is not followed, an attacker could infer information and mount a ti
14091409
<p>A timing attack is a method of obtaining information about content that
14101410
is otherwise protected, based on studying the amount of time it takes for
14111411
an operation to occur. If, for example, red pixels took longer to
1412-
draw than green pixels, one might be able to reconstruct a rough image of
1413-
the element being rendered, without ever having access to the content
1412+
draw than green pixels, one might be able to reconstruct a rough image of
1413+
the element being rendered, without ever having access to the content
14141414
of the element.</p>
14151415
</div>
14161416

@@ -1446,11 +1446,11 @@ Working draft of 10 October 2013</a>:
14461446
The following changes were made relative to the <a
14471447
href="https://www.w3.org/TR/2013/WD-compositing-1-20130625/" >Working
14481448
Draft of 2013-06-25</a>:
1449-
1449+
14501450
<ul>
1451-
<li>clipping was removed as one of the operators that
1451+
<li>clipping was removed as one of the operators that
14521452
creates an isolated group in SVG
1453-
<li>background-blend-mode was changed so it matches
1453+
<li>background-blend-mode was changed so it matches
14541454
repeating behavior of other background syntaxes.
14551455
<li>The mix-composite property was removed
14561456
<li>all open issues were resolved

0 commit comments

Comments
 (0)