-
Notifications
You must be signed in to change notification settings - Fork 0
/
3dtest.html
31 lines (27 loc) · 1.17 KB
/
3dtest.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<link rel="stylesheet" href="3d.css">
<!--
--unit in SVG amounts to 127/96
| | SVG unit | CSS unit |
|-------|----------|--------------------------|
|height | 105.83333| calc(8 * var(--unit)) |
|width | 79.375 | calc(6 * var(--unit)) |
|rx=ry | 9.921875 | calc(0.75 * var(--unit)) |
-->
<body style="background-color: blanchedalmond;">
<div class="piece" style="transform: translate(100px, 100px) rotate3d(-1, -1, -1, 160deg);">
<div class="face face1"><img src="./assets/1萬.png" height="80"></div>
<div class="face face2">2</div>
<div class="face side-faceA">A</div>
<div class="face side-faceB">B</div>
<div class="face side-faceC">C</div>
<div class="face side-faceD">D</div>
</div>
<div class="piece" style="transform: translate(100px, 150px) rotate3d(1,0.3, 0, 30deg);">
<div class="face face1"><img src="./assets/1萬.png" height="80"></div>
<div class="face face2">2</div>
<div class="face side-faceA">A</div>
<div class="face side-faceB">B</div>
<div class="face side-faceC">C</div>
<div class="face side-faceD">D</div>
</div>
</body>