Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(293)

Side by Side Diff: LayoutTests/css3/compositing/mix-blend-mode-isolated-group-1.html

Issue 23503046: [CSS Blending] Implement mix-blend-mode in software. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Rebase Created 7 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <style>
5
6 body {
7 background: red;
8 }
9
10 div {
11 margin: 20px;
12 width: 60px;
13 height: 60px;
14 }
15
16 .parent {
17 opacity: 0.99;
18 float: left;
19 background: violet;
20 }
21
22 .child {
23 background: url('resources/ducky.png') no-repeat 0 0 /100% 100%, green;
24 }
25
26 </style>
27 <!-- Test to ensure that blending is performed only with the contents of the ele ment's nearest ancestor stacking context.
28 Test this with a parent element that has opacity set. -->
29 <body>
30 <div class="parent">
31 <div class="child" style="mix-blend-mode: normal;"></div>
32 </div>
33 <div class="parent">
34 <div class="child" style="mix-blend-mode: multiply;"></div>
35 </div>
36 <div class="parent">
37 <div class="child" style="mix-blend-mode: screen;"></div>
38 </div>
39 <div class="parent">
40 <div class="child" style="mix-blend-mode: overlay;"></div>
41 </div>
42 <div class="parent">
43 <div class="child" style="mix-blend-mode: darken;"></div>
44 </div>
45 <div class="parent">
46 <div class="child" style="mix-blend-mode: lighten;"></div>
47 </div>
48 <div class="parent">
49 <div class="child" style="mix-blend-mode: color-dodge;"></div>
50 </div>
51 <div class="parent">
52 <div class="child" style="mix-blend-mode: color-burn;"></div>
53 </div>
54 <div class="parent">
55 <div class="child" style="mix-blend-mode: hard-light;"></div>
56 </div>
57 <div class="parent">
58 <div class="child" style="mix-blend-mode: soft-light;"></div>
59 </div>
60 <div class="parent">
61 <div class="child" style="mix-blend-mode: difference;"></div>
62 </div>
63 <div class="parent">
64 <div class="child" style="mix-blend-mode: exclusion;"></div>
65 </div>
66 <div class="parent">
67 <div class="child" style="mix-blend-mode: hue;"></div>
68 </div>
69 <div class="parent">
70 <div class="child" style="mix-blend-mode: saturation;"></div>
71 </div>
72 <div class="parent">
73 <div class="child" style="mix-blend-mode: color;"></div>
74 </div>
75 <div class="parent">
76 <div class="child" style="mix-blend-mode: luminosity;"></div>
77 </div>
78 </body>
79 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698