third_party/WebKit/LayoutTests/fast/forms/select/listbox-appearance-basic.html

   1 <!DOCTYPE html>
   2 <body>
   3 <style>
   4 select {
   5     margin: 4px;
   6 }
   7 </style>
   8 <script>
   9 if (window.testRunner)
  10     testRunner.setUseMockTheme(false);
  11 </script>
  12
  13 <select multiple><option>foo</option></select>
  14 <select multiple><option selected>foo</option><option>bar</option></select>
  15 <script>
  16 // autofocus makes the test timeout.
  17 document.querySelectorAll('select')[1].focus();
  18 </script>
  19 <select multiple><option selected>foo</option><option selected disabled>bar</option></select>
  20 <select multiple disabled><option selected>foo</option><option>bar</option><optgroup><option selected>baz</option></optgroup></select>
  21
  22 <select multiple size=1><option>foo1</option><option>foo2</option><option>foo3</option><option>foo4</option></select>
  23 <select multiple size=2><option>foo1</option><option>foo2</option><option>foo3</option><option>foo4</option></select>
  24 <select multiple size=3><option>foo1</option><option>foo2</option><option>foo3</option><option>foo4</option></select>
  25 <br>
  26
  27 <!-- border -->
  28 <select multiple style="border: 3px solid lime;"><option>foo</option></select>
  29 <select multiple style="border-radius: 6px;"><option>foo</option></select> <br>
  30
  31 <!-- background -->
  32 <select multiple style="background: linear-gradient(to bottom, #dea 0%,#9c7 44%,#494 100%);"><option>foo</option></select> <br>
  33
  34 <!-- shadow -->
  35 <select multiple style="box-shadow: 4px 4px 10px rgba(255,0,0,0.5), inset 4px 4px 4px rgba(0,255,0,0.5);"><option>foo</option></select> <br>
  36
  37 <!-- font-size -->
  38 <select multiple style="font-size: 16px;"><option>foo</option></select>
  39 <select multiple style="font-size: 20px;"><option>foo</option></select>
  40 <select multiple style="font-size: 24px;"><option>foo</option></select>
  41 <select multiple style="font-size: 16px;"><option>foo</option><option style="font-size: 24px;">bar</option></select>
  42  <br>
  43
  44 <!-- zoom -->
  45 <select multiple style="zoom: 1.5;"><option>foo</option></select>
  46 <select multiple style="zoom: 2;"><option>foo</option></select> <br>
  47 </body>