| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| div { |
| position: absolute; |
| transform-origin: 0% 0%; |
| } |
| #div1 { |
| transform: translate3d(300px, 10px, 1px); |
| } |
| #div2 { |
| transform: translate3d(200px, 20px, 2px); |
| } |
| #div3 { |
| transform: translate3d(100px, 30px, 3px); |
| } |
| #div4 { |
| transform: translate3d(300px, 40px, 4px); |
| } |
| #div5 { |
| transform: translate3d(200px, 50px, 5px); |
| } |
| #div6 { |
| transform: translate3d(100px, 60px, 6px); |
| } |
| #div7 { |
| transform: translate3d(0px, 70px, 7px); |
| } |
| #div8 { |
| transform: translate3d(200px, 80px, 8px); |
| } |
| #div9 { |
| transform: translate3d(1000px, 90px, 9px); |
| } |
| #div10 { |
| transform: translate3d(0px, 100px, 10px); |
| } |
| #div11 { |
| transform: translate3d(200px, 110px, 11px); |
| } |
| #div12 { |
| transform: translate3d(1000px, 120px, 12px); |
| } |
| </style> |
| </head> |
| <body> |
| <div id="div1">div1</div> |
| <div id="div2">div2</div> |
| <div id="div3">div3</div> |
| <div id="div4">div4</div> |
| <div id="div5">div5</div> |
| <div id="div6">div6</div> |
| <div id="div7">div7</div> |
| <div id="div8">div8</div> |
| <div id="div9">div9</div> |
| <div id="div10">div10</div> |
| <div id="div11">div11</div> |
| <div id="div12">div12</div> |
| </body> |
| </html> |
