Team:Glendale CC AZ/css.main

From 2013.igem.org

(Difference between revisions)
(Created page with "<html> <style> body{background-color:#5d216c;width:600px;margin:100px auto;} .box { width:auto; height:100px; background-color:#6a2e79; margin:0 auto; float:left; fon...")
Line 1: Line 1:
-
<html>
+
<?xml version="1.0" encoding="UTF-8"?>
-
<style>
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
-
body{background-color:#5d216c;width:600px;margin:100px auto;}
+
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-
.box {
+
-
  width:auto;
+
-
  height:100px;
+
-
  background-color:#6a2e79;
+
-
  margin:0 auto;
+
-
  float:left;
+
-
  font-size:100px;
+
-
  padding:20px;
+
-
  color:#fff;
+
-
}
+
-
/* Step 1: Build the Animation */
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
-
@-webkit-keyframes aniload {
+
<head>
-
  from {-webkit-transform:translate(0px, 1000px)}
+
<title>HTML</title>
-
  to  {-webkit-transform:translate(0px, 0px)}
+
-
}
+
-
@-moz-keyframes aniload {
+
</head>
-
  from {-moz-transform:translate(0px, 1000px)}
+
-
  to  {-moz-transform:translate(0px, 0px)}
+
-
}
+
-
@-ms-keyframes aniload {
+
<body>
-
  from {-ms-transform:translate(0px, 1000px)}
+
-
  to  {-ms-transform:translate(0px, 0px)}
+
-
}
+
-
@-o-keyframes aniload {
+
</body>
-
  from {-o-transform:translate(0px, 1000px)}
+
-
  to  {-o-transform:translate(0px, 0px)}
+
-
}
+
-
 
+
-
@keyframes aniload {
+
-
  from {transform:translate(0px, 1000px)}
+
-
  to  {transform:translate(0px, 0px)}
+
-
}
+
-
 
+
-
/* Step 2: Call the Animation */
+
-
#box1 {
+
-
  -webkit-animation:aniload 4s;
+
-
  -moz-animation:aniload 4s;
+
-
  -ms-animation:aniload 4s;
+
-
  -o-animation:aniload 4s;
+
-
  animation:aniload 4s;
+
-
}
+
-
 
+
-
#box2 {
+
-
  -webkit-animation:aniload 1s;
+
-
  -moz-animation:aniload 1s;
+
-
  -ms-animation:aniload 1s;
+
-
  -o-animation:aniload 1s;
+
-
  animation:aniload 1s;
+
-
}
+
-
 
+
-
#box3 {
+
-
  -webkit-animation:aniload 4s;
+
-
  -moz-animation:aniload 4s;
+
-
  -ms-animation:aniload 4s;
+
-
  -o-animation:aniload 4s;
+
-
  animation:aniload 4s;
+
-
}
+
-
 
+
-
#box4 {
+
-
  -webkit-animation:aniload 3s;
+
-
  -moz-animation:aniload 3s;
+
-
  -ms-animation:aniload 3s;
+
-
  -o-animation:aniload 3s;
+
-
  animation:aniload 3s;
+
-
}
+
-
 
+
-
#box5 {
+
-
  -webkit-animation:aniload 2s;
+
-
  -moz-animation:aniload 2s;
+
-
  -ms-animation:aniload 2s;
+
-
  -o-animation:aniload 2s;
+
-
  animation:aniload 2s;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
.copyright{width:100%;height:auto; background-color:#171717;color:#aaa;position:fixed; bottom:0px;font:  12px Arial;padding:5px;opacity:0.4;border-top:#a00 2px solid;z-index:99999;left:0px;right:0px;}.copyright:hover{opacity:1}
+
-
 
+
-
/* Ayhan Altınok*/
+
-
</style>
+
-
<body>
+
-
 
+
-
<div class="sinir">
+
-
  <div class="box" id="box1">i</div>
+
-
  <div class="box" id="box2">G</div>
+
-
  <div class="box" id="box3">E</div>
+
-
  <div class="box" id="box4">M</div>
+
-
  <div class="box" id="box5">@</div>
+
-
  <div class="box" id="box1">G</div>
+
-
  <div class="box" id="box2">C</div>
+
-
  <div class="box" id="box3">C</div>
+
-
</div>
+
-
 
+
-
 
+
-
 
+
-
 
+
-
<div class="copyright"><font style="float:right; margin-right:30px;">Copyright &copy; 2013 - Ayhan ALTINOK </font>İletişim bilgileri :<font style="color:#505050"> Web Adresi:</font> www.graphicsfamily.com <font style="color:#505050"> Mail :</font> ayhanaltinokesk@gmail.com <font style="color:#505050">Facebook: </font>www.facebook.com/ayhanaltinokesk</div>
+
-
 
+
-
 
+
-
</body>
+
</html>
</html>

Revision as of 07:19, 12 August 2013

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

HTML

Retrieved from "http://2013.igem.org/Team:Glendale_CC_AZ/css.main"