https://github.com/web-platform-tests/wpt
Raw File
Tip revision: b1e9f14334bb9e17d158f1eb9a598967a80a1236 authored by Tarun Bansal on 09 April 2018, 19:19:04 UTC
Add external WPT test for cross-origin requests
Tip revision: b1e9f14
t424-hsl-values-b-15.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Test: hsl() values</title>
<link rel="author" title="L. David Baron" href="https://dbaron.org/" />
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
<link rel="author" title="Intel" href="http://www.intel.com">
<link rel="help" href="http://www.w3.org/TR/css3-color/#hsl-color" />
<link rel="match" href="t424-hsl-values-b-15-ref.html" />
<meta name="flags" content="" />
<meta name="assert" content="Implementation of algorithm for converting hsl() colors to rgb() colors." />
<style>
  table { border-spacing: 0; padding: 0; border: none; }
  td { border: none; padding: 0; }
  td { width: 1.2em; height: 1.2em; }
</style>
<body>
  <p>The following two matching (except the checkerboard at both ends to show where the rows are) rows of colors should change in ten steps from black at the left to white at the right with fuchsia at the middle.</p>
  <table>
    <tr>
      <td style="background: black">&nbsp;</td>
      <td style="background: hsl(300, 100%, 0%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 10%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 20%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 30%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 40%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 50%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 60%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 70%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 80%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 90%)">&nbsp;</td>
      <td style="background: hsl(300, 100%, 100%)">&nbsp;</td>
      <td style="background: white">&nbsp;</td>
    </tr>
    <tr>
      <td style="background: white">&nbsp;</td>
      <td style="background: rgb(0, 0, 0)">&nbsp;</td>
      <td style="background: rgb(51, 0, 51)">&nbsp;</td>
      <td style="background: rgb(102, 0, 102)">&nbsp;</td>
      <td style="background: rgb(153, 0, 153)">&nbsp;</td>
      <td style="background: rgb(204, 0, 204)">&nbsp;</td>
      <td style="background: rgb(255, 0, 255)">&nbsp;</td>
      <td style="background: rgb(255, 51, 255)">&nbsp;</td>
      <td style="background: rgb(255, 102, 255)">&nbsp;</td>
      <td style="background: rgb(255, 153, 255)">&nbsp;</td>
      <td style="background: rgb(255, 204, 255)">&nbsp;</td>
      <td style="background: rgb(255, 255, 255)">&nbsp;</td>
      <td style="background: black">&nbsp;</td>
    </tr>
  </table>
</body>
back to top