third_party/WebKit/LayoutTests/fast/borders/border-mixed-alpha2.html

   1 <!doctype html>
   2 <style>
   3     div {
   4         width: 10px;
   5         height: 100px;
   6         display: inline-block;
   7         border-width: 85px;
   8     }
   9     .dashed {
  10         border-style: dashed;
  11         border-top-color: rgba(0, 255, 0, 0.75);
  12         border-right-color: rgba(0, 0, 255, 0.75);
  13         border-bottom-color: rgba(0, 255, 0, 0.75);
  14         border-left-color: rgba(0, 0, 255, 0.75);
  15     }
  16     .dotted {
  17         border-style: dotted;
  18         border-top-color: rgba(0, 255, 0, 0.5);
  19         border-right-color: rgba(0, 0, 255, 0.75);
  20         border-bottom-color: rgba(0, 255, 0, 0.75);
  21         border-left-color: rgba(0, 0, 255, 0.5);
  22     }
  23     .solid {
  24         border-style: solid;
  25         border-top-color: rgba(0, 255, 0, 0.5);
  26         border-right-color: rgba(0, 0, 255, 0.75);
  27         border-bottom-color: rgba(0, 255, 0, 0.5);
  28         border-left-color: rgba(0, 0, 255, 0.5);
  29     }
  30     .double {
  31         border-style: double;
  32         border-top-color: rgba(0, 255, 0, 0.5);
  33         border-right-color: rgba(0, 0, 255, 0.75);
  34         border-bottom-color: rgba(0, 255, 0, 0.25);
  35         border-left-color: rgba(0, 0, 255, 0.5);
  36
  37     }
  38     .groove {
  39         border-style: groove;
  40         border-top-color: rgba(0, 255, 0, 0.5);
  41         border-right-color: rgba(0, 0, 255, 0.75);
  42         border-bottom-color: rgba(0, 255, 0, 0.25);
  43         border-left-color: rgba(0, 0, 255, 0.25);
  44
  45     }
  46     .ridge {
  47         border-style: ridge;
  48         border-top-color: rgba(0, 255, 0, 0.5);
  49         border-right-color: rgba(0, 0, 255, 0.75);
  50         border-bottom-color: rgba(0, 255, 0, 0.15);
  51         border-left-color: rgba(0, 0, 255, 0.25);
  52
  53     }
  54     .inset {
  55         border-style: inset;
  56         border-top-color: rgba(0, 255, 0, 0.5);
  57         border-right-color: rgba(0, 0, 255, 0.75);
  58         border-bottom-color: rgba(0, 255, 0, 0.25);
  59         border-left-color: rgba(0, 0, 255, 0.15);
  60
  61     }
  62     .outset {
  63         border-style: outset;
  64         border-top-color: rgba(0, 255, 0, 0.15);
  65         border-right-color: rgba(0, 0, 255, 0.75);
  66         border-bottom-color: rgba(0, 255, 0, 0.25);
  67         border-left-color: rgba(0, 0, 255, 0.15);
  68
  69     }
  70 </style>
  71 <div class="dashed"></div>
  72 <div class="dotted"></div>
  73 <div class="solid"></div>
  74 <div class="double"></div>
  75 <br>
  76 <div class="groove"></div>
  77 <div class="ridge"></div>
  78 <div class="inset"></div>
  79 <div class="outset"></div>
  80 <script>
  81     if (window.testRunner)
  82         testRunner.dumpAsTextWithPixelResults();
  83 </script>