third_party/WebKit/LayoutTests/fast/backgrounds/mask-composite.html

   1 <style>
   2 .test {
   3         width: 200px;
   4         height: 200px;
   5         border:10px solid black;
   6         background-color:lime;
   7         -webkit-mask-image: url(resources/mask-top-left.png), url(resources/mask-top-right.png), url(resources/mask-bottom-left.png), url(resources/mask-bottom-right.png),
   8                             url(resources/mask-top.png), url(resources/mask-right.png), url(resources/mask-bottom.png), url(resources/mask-left.png), url(resources/mask-center.png);
   9         -webkit-mask-position: top left, top right, bottom left, bottom right, top center, center right, bottom center, center left, center;
  10         -webkit-mask-origin: border;
  11         -webkit-mask-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x, repeat-y, repeat-x, repeat-y, repeat;
  12         -webkit-mask-composite: copy;
  13 }
  14
  15 </style>
  16
  17 The lime div below should have a soft glow effect.
  18
  19 <div class="test"></div>