Chromium Code Reviews Chromium Code Reviews
Issue 23503046:
[CSS Blending] Implement mix-blend-mode in software. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| Index: LayoutTests/css3/compositing/mix-blend-mode-simple-text.html |
| diff --git a/LayoutTests/css3/compositing/mix-blend-mode-simple-text.html b/LayoutTests/css3/compositing/mix-blend-mode-simple-text.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..ec0b89394fc5d5a3c6d3ec9e1e264e51e6a807c5 |
| --- /dev/null |
| +++ b/LayoutTests/css3/compositing/mix-blend-mode-simple-text.html |
| @@ -0,0 +1,63 @@ |
| +<!DOCTYPE HTML> |
| +<html> |
| +<head> |
| +<style> |
| + div { |
| + margin: 20px; |
| + width: 130px; |
| + height: 130px; |
| + color:#00ff00; |
| + float: left; |
| + } |
| +</style> |
| +<body> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: normal; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
|
Julien - ping for review
2013/10/03 21:38:28
Can we at least use Ahem with a line-height to hav
|
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: multiply; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: screen; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: overlay; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: darken; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: lighten; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: color-dodge; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: color-burn; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: hard-light; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: soft-light; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: difference; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: exclusion; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: hue; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: saturation; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: color; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| + <div style="background: green"> |
| + <div style="mix-blend-mode: luminosity; background-color: blue;">The quick brown fox jumps over the lazy dog</div> |
| + </div> |
| +</body> |
| +</html> |
