First Draft

First Draft of the Example Files
2020-12-10 13:21:38 +00:00
parent 77a7b57c4f
commit 0335342e00
1127 changed files with 46959 additions and 56 deletions
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Transitioning on hover</title>
+    <style>
+      #square {
+        position          :absolute;
+        top               :50px;
+        left              :50px;
+        width             :100px;
+        height            :100px;
+        padding           :2px;
+        text-align        :center;
+        border-width      :1px;
+        border-style      :solid;
+        background        :orange;
+        transition        :all .8s ease-in-out;
+        -moz-transition   :all .8s ease-in-out;
+        -webkit-transition:all .8s ease-in-out;
+        -o-transition     :all .8s ease-in-out;
+        -ms-transition    :all .8s ease-in-out;
+      }
+      #square:hover {
+        background        :yellow;
+        -moz-transform    :rotate(180deg);
+        -webkit-transform :rotate(180deg);
+        -o-transform      :rotate(180deg);
+        -ms-transform     :rotate(180deg);
+        transform         :rotate(180deg);
+      }
+    </style>
+  </head>
+  <body>
+    <div id='square'>
+      Square shape<br>
+      created using<br>
+      a simple div<br>
+      element with<br>
+      a 1px border
+    </div>
+  </body>
+</html>