OLD | NEW |
1 <style> | 1 <style> |
2 body { margin: 0; color: lightgreen; font-family: Ahem; font-size: 20px; } | 2 body { margin: 0; color: lightgreen; font-family: Ahem; font-size: 20px; } |
3 | 3 |
4 .square { | 4 .square { |
5 width: 30px; | 5 width: 30px; |
6 height: 30px; | 6 height: 30px; |
7 background-color: lightyellow; | 7 background-color: lightyellow; |
8 margin: 20px; | 8 margin: 20px; |
9 float: left; | 9 float: left; |
10 padding: 5px; | 10 padding: 5px; |
11 } | 11 } |
12 | 12 |
13 .rounded { | 13 .rounded { |
14 -webkit-border-radius: 10px; | 14 -webkit-border-radius: 10px; |
15 } | 15 } |
16 | 16 |
17 .transform1 { | 17 .transform1 { |
18 -webkit-transform: rotate(45deg); | 18 transform: rotate(45deg); |
19 } | 19 } |
20 | 20 |
21 .transform2 { | 21 .transform2 { |
22 -webkit-transform: scale(0.5, 1); | 22 transform: scale(0.5, 1); |
23 } | 23 } |
24 | 24 |
25 .transform3 { | 25 .transform3 { |
26 -webkit-transform: rotate(45deg) scale(0.5, 1); | 26 transform: rotate(45deg) scale(0.5, 1); |
27 } | 27 } |
28 | 28 |
29 .transform4 { | 29 .transform4 { |
30 -webkit-transform: skewX(45deg); | 30 transform: skewX(45deg); |
31 } | 31 } |
32 | 32 |
33 .shadow1 { | 33 .shadow1 { |
34 -webkit-box-shadow: black 10px 10px 0; | 34 -webkit-box-shadow: black 10px 10px 0; |
35 } | 35 } |
36 | 36 |
37 .shadow2 { | 37 .shadow2 { |
38 -webkit-box-shadow: black 10px 10px 10px; | 38 -webkit-box-shadow: black 10px 10px 10px; |
39 } | 39 } |
40 | 40 |
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
83 <div class="square text-shadow2 transform1">X</div> | 83 <div class="square text-shadow2 transform1">X</div> |
84 <div class="square text-shadow2 transform2">X</div> | 84 <div class="square text-shadow2 transform2">X</div> |
85 <div class="square text-shadow2 transform3">X</div> | 85 <div class="square text-shadow2 transform3">X</div> |
86 <div class="square text-shadow2 transform4">X</div> | 86 <div class="square text-shadow2 transform4">X</div> |
87 <div style="clear: both;"></div> | 87 <div style="clear: both;"></div> |
88 <div class="square text-shadow3">X</div> | 88 <div class="square text-shadow3">X</div> |
89 <div class="square text-shadow3 transform1">X</div> | 89 <div class="square text-shadow3 transform1">X</div> |
90 <div class="square text-shadow3 transform2">X</div> | 90 <div class="square text-shadow3 transform2">X</div> |
91 <div class="square text-shadow3 transform3">X</div> | 91 <div class="square text-shadow3 transform3">X</div> |
92 <div class="square text-shadow3 transform4">X</div> | 92 <div class="square text-shadow3 transform4">X</div> |
OLD | NEW |