Team:BIT/human practice.css

From 2014.igem.org

(Difference between revisions)
 
(15 intermediate revisions not shown)
Line 5: Line 5:
/*其他*/
/*其他*/
body{ overflow-x:hidden;}
body{ overflow-x:hidden;}
 +
p{ font-size:18px;}
-
#footer1{ position:absolute;top:4800px;z-index:-1;}
+
#footer1{ position:absolute;top:1200px;z-index:-1;}
 +
#footer-box {margin-top: 1300px;border: none;}
#left{ width:211px;height:300px; position:absolute; top:104px; left:30px;margin:10px 10px 0 0 ; z-index:2;}
#left{ width:211px;height:300px; position:absolute; top:104px; left:30px;margin:10px 10px 0 0 ; z-index:2;}
#right{ width:704px;height:800px;position:absolute; top:10px; left:230px;margin:10px 0 0 0 ; color:#666; }
#right{ width:704px;height:800px;position:absolute; top:10px; left:230px;margin:10px 0 0 0 ; color:#666; }
-
 
+
ul{list-style: none;}
*{margin:0;padding:0;list-style-type:none;}
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
a,img{border:0;}
Line 26: Line 28:
/* tour */
/* tour */
-
#tour{z-index:1;position:relative;padding:80px;position:relative;z-index:1;padding-top:0;min-height:700px;margin-top:-350px;padding-top:80px; z-index:2;}
+
#tour{position:relative;position:relative;padding-top:0;min-height:700px;margin-top:-1050px;z-index:2;text-align: justify;
 +
text-indent: 2em;}
 +
#tour ::-webkit-scrollbar {
 +
width: 8px;
 +
}
 +
::-webkit-scrollbar-button {
 +
width: 8px;
 +
height:5px;
 +
}
 +
::-webkit-scrollbar-track {
 +
background:#eee;
 +
border: thin solid lightgray;
 +
box-shadow: 0px 0px 3px #dfdfdf inset;
 +
border-radius:10px;
 +
}
 +
::-webkit-scrollbar-thumb {
 +
background:#999;
 +
border: thin solid gray;
 +
border-radius:10px;
 +
}
 +
::-webkit-scrollbar-thumb:hover {
 +
background:#7d7d7d;
 +
}
 +
#img{list-style:none;}
#img-slider .slide{width:100%;background:#fff;position:absolute; list-style-image:none;}
#img-slider .slide{width:100%;background:#fff;position:absolute; list-style-image:none;}
-
#img-slider .slide .img{margin:10px auto;border:none;}
+
#img-slider .slide .img{margin:10px auto;border:none;list-style: none;}
-
#img-slider .img{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 0 rgba(204,205,206,5);-moz-box-shadow:0 1px 0 rgba(204,205,206,5);-ms-box-shadow:0 1px 0 rgba(204,205,206,5);box-shadow:0 1px 0 rgba(204,205,206,5);border:1px solid #edeeee;background-color:#fff;width:780px;height:500px;position:relative;}
+
#img-slider .img{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 0 rgba(204,205,206,5);-moz-box-shadow:0 1px 0 rgba(204,205,206,5);-ms-box-shadow:0 1px 0 rgba(204,205,206,5);box-shadow:0 1px 0 rgba(204,205,206,5);border:1px solid #edeeee;background-color:#fff;width:780px;height:500px;position:relative;list-style: none;}
-
#img-slider .img img{display:block;width:100%;}
+
#img-slider .img img{display:block;width:100%;list-style: none;}
-
#img-slider .img .label{-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;background:#35a5ca;padding:2.5% 0;position:absolute;bottom:0;left:0;right:0;font-weight:400;text-align:center;color:#fff;font-size:150%;}
+
#img-slider .img .label{-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;background:#35a5ca;padding:2.5% 0;position:absolute;bottom:0;left:0;right:0;font-weight:400;text-align:center;color:#fff;font-size:150%;list-style: none;}
-
#img-slider .img:first-child{display:block;}
+
#img-slider .img:first-child{display:block;list-style: none;}
.switcher-wrap{position:relative;padding-bottom:60px;padding-left:80px;padding-right:80px;}
.switcher-wrap{position:relative;padding-bottom:60px;padding-left:80px;padding-right:80px;}
.switcher-wrap.slider{padding-left:380px;padding-right:380px;}
.switcher-wrap.slider{padding-left:380px;padding-right:380px;}
-
.switcher-wrap.slider #img-slider .img{-webkit-box-shadow:0 4px 20px rgba(0,0,0,0.4);-moz-box-shadow:0 4px 20px rgba(0,0,0,0.4);-ms-box-shadow:0 4px 20px rgba(0,0,0,0.4);box-shadow:0 4px 20px rgba(0,0,0,0.4);border-color:#fff;}
+
.switcher-wrap.slider #img-slider .img{-webkit-box-shadow:0 4px 20px rgba(0,0,0,0.4);-moz-box-shadow:0 4px 20px rgba(0,0,0,0.4);-ms-box-shadow:0 4px 20px rgba(0,0,0,0.4);box-shadow:0 4px 20px rgba(0,0,0,0.4);border-color:#fff;list-style: none;overflow:scroll;overflow-x: hidden;padding:15px; }
-
.switcher-wrap a.next,.switcher-wrap a.prev{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;position:absolute;width:50px;height:50px;top:50%;margin-top:-25px;bottom:0;left:0;background:url(../img/sprites.png) no-repeat 16px 12px;z-index:1000;-webkit-transition:background-color 300ms linear;-moz-transition:background-color 300ms linear;-o-transition:background-color 300ms linear;-ms-transition:background-color 300ms linear;transition:background-color 300ms linear;}
+
.switcher-wrap a.next,.switcher-wrap a.prev{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;position:absolute;width:50px;height:50px;top:50%;margin-top:-25px;bottom:0;left:0;background:url(https://static.igem.org/mediawiki/2014/a/ab/BIT_sprites.png) no-repeat 16px 12px;z-index:1000;-webkit-transition:background-color 300ms linear;-moz-transition:background-color 300ms linear;-o-transition:background-color 300ms linear;-ms-transition:background-color 300ms linear;transition:background-color 300ms linear;}
.switcher-wrap a.next:hover,.switcher-wrap a.prev:hover{background-color:rgba(16,175,139,0.1);}
.switcher-wrap a.next:hover,.switcher-wrap a.prev:hover{background-color:rgba(16,175,139,0.1);}
.switcher-wrap a.prev{right:0;left:auto;background-position:-63px 12px;}
.switcher-wrap a.prev{right:0;left:auto;background-position:-63px 12px;}

Latest revision as of 12:42, 16 October 2014

@charset "utf-8"; /* CSS Document */


/*其他*/ body{ overflow-x:hidden;} p{ font-size:18px;}

  1. footer1{ position:absolute;top:1200px;z-index:-1;}
  2. footer-box {margin-top: 1300px;border: none;}
  1. left{ width:211px;height:300px; position:absolute; top:104px; left:30px;margin:10px 10px 0 0 ; z-index:2;}
  2. right{ width:704px;height:800px;position:absolute; top:10px; left:230px;margin:10px 0 0 0 ; color:#666; }

ul{list-style: none;}

  • {margin:0;padding:0;list-style-type:none;}

a,img{border:0;}

a,a:hover{text-decoration: none;}






/* tour */

  1. tour{position:relative;position:relative;padding-top:0;min-height:700px;margin-top:-1050px;z-index:2;text-align: justify;

text-indent: 2em;}

  1. tour ::-webkit-scrollbar {

width: 8px; } ::-webkit-scrollbar-button { width: 8px; height:5px; } ::-webkit-scrollbar-track { background:#eee; border: thin solid lightgray; box-shadow: 0px 0px 3px #dfdfdf inset; border-radius:10px; } ::-webkit-scrollbar-thumb { background:#999; border: thin solid gray; border-radius:10px; } ::-webkit-scrollbar-thumb:hover { background:#7d7d7d; }

  1. img{list-style:none;}
  2. img-slider .slide{width:100%;background:#fff;position:absolute; list-style-image:none;}
  3. img-slider .slide .img{margin:10px auto;border:none;list-style: none;}
  4. img-slider .img{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 1px 0 rgba(204,205,206,5);-moz-box-shadow:0 1px 0 rgba(204,205,206,5);-ms-box-shadow:0 1px 0 rgba(204,205,206,5);box-shadow:0 1px 0 rgba(204,205,206,5);border:1px solid #edeeee;background-color:#fff;width:780px;height:500px;position:relative;list-style: none;}
  5. img-slider .img img{display:block;width:100%;list-style: none;}
  6. img-slider .img .label{-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-ms-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;background:#35a5ca;padding:2.5% 0;position:absolute;bottom:0;left:0;right:0;font-weight:400;text-align:center;color:#fff;font-size:150%;list-style: none;}
  7. img-slider .img:first-child{display:block;list-style: none;}

.switcher-wrap{position:relative;padding-bottom:60px;padding-left:80px;padding-right:80px;} .switcher-wrap.slider{padding-left:380px;padding-right:380px;} .switcher-wrap.slider #img-slider .img{-webkit-box-shadow:0 4px 20px rgba(0,0,0,0.4);-moz-box-shadow:0 4px 20px rgba(0,0,0,0.4);-ms-box-shadow:0 4px 20px rgba(0,0,0,0.4);box-shadow:0 4px 20px rgba(0,0,0,0.4);border-color:#fff;list-style: none;overflow:scroll;overflow-x: hidden;padding:15px; } .switcher-wrap a.next,.switcher-wrap a.prev{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;position:absolute;width:50px;height:50px;top:50%;margin-top:-25px;bottom:0;left:0;background:url(BIT_sprites.png) no-repeat 16px 12px;z-index:1000;-webkit-transition:background-color 300ms linear;-moz-transition:background-color 300ms linear;-o-transition:background-color 300ms linear;-ms-transition:background-color 300ms linear;transition:background-color 300ms linear;} .switcher-wrap a.next:hover,.switcher-wrap a.prev:hover{background-color:rgba(16,175,139,0.1);} .switcher-wrap a.prev{right:0;left:auto;background-position:-63px 12px;} .switcher-wrap ul.switcher{text-align:center;position:absolute;left:0;right:0;bottom:0;} .switcher-wrap ul.switcher li{display:inline-block;padding:2px;border:1px solid #35a5ca;border-radius:100%;margin:0 4px;} .switcher-wrap ul.switcher li a{display:block;width:14px;height:14px;-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;border-radius:100%;-o-transition:background 0.30s ease-in-out;-webkit-transition:background 0.30s ease-in-out;-moz-transition:background 0.30s ease-in-out;transition:background 0.30s ease-in-out;} .switcher-wrap ul.switcher li a:hover,.switcher-wrap ul.switcher li.active a{background:#35a5ca;} .switcher-wrap ul.switcher li:last-child{margin-right:0;}