tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

offset-path-shape-shape-001.html (894B)

      1 <!DOCTYPE html>
      2 <meta charset="utf-8">
      3 <title>CSS Motion Path test: &lt;basic-shape&gt; shape() function</title>
      4 <link rel="help" href="https://drafts.fxtf.org/motion/#valdef-offset-path-basic-shape">
      5 <link rel="help" href="https://drafts.csswg.org/css-shapes-2/#shape-function">
      6 <link rel="match" href="offset-path-shape-shape-001-ref.html">
      7 <meta name="assert" content="This tests that shape() generates a rotation and translation.">
      8 
      9 <style>
     10 #outer {
     11  top: 100px;
     12  left: 100px;
     13  position: relative;
     14  width: 600px;
     15  height: 400px;
     16 }
     17 
     18 #box {
     19  width: 100px;
     20  height: 100px;
     21  background-color: green;
     22  offset-path: shape(from 0px 0%,
     23                     hline by 100%,
     24                     vline to 400px,
     25                     hline by -100%,
     26                     close);
     27  offset-distance: 40%;
     28  border-radius: 50% 50% 0 0;
     29 }
     30 </style>
     31 
     32 <div id="outer">
     33  <div id="box"></div>
     34 </div>