Difference between revisions of "Team:SSTi-SZGD/css/Home"

 
(28 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
body{ min-width: 1347px; min-height: 465px; position: relative;}
+
body{ min-width: 1024px; min-height: 489px; position: relative;}
  
−
.SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/3/3d/SSTi-SZGD_banner.jpeg) no-repeat 0px 0px; min-height: 465px; background-size: cover; padding-top: 15px;}
+
.SSTi-SZGD img{ width: 100%;}
  
−
/*自定义header*/
+
/*custom header*/
 +
.header{ position: absolute; margin-top: 15px;}
 
.header .nav .Home span{ color: #FAEE0D;}
 
.header .nav .Home span{ color: #FAEE0D;}
  
−
.topic{ position: absolute; margin: auto; left: 0; right: 0; text-align: center; font-size: 5rem; color: white;}
 
−
.topic p{ width: 58.28%; padding: 30px; border-top: 5px solid white; border-bottom: 5px solid white; margin: auto;}
 
  
−
/*Abstract*/
+
/*--1190--*/
−
.Content{ width: 100%; height: 500px; background: #333333; display: block;}
+
@media only screen and (max-width: 1190px) {
−
.Abstract{ background: url(https://static.igem.org/mediawiki/2017/4/49/SSTi-SZGD_background_Abstract.png) no-repeat 0px 0px; background-size: cover; padding: 50px 0; display: none;}
+
−
.Abstract p{ width: 80%; font-size: 3rem; margin: auto; background: rgba(0,0,0,0.3); color: white; padding: 20px 2%; text-align: justify;}
+
−
 
+
−
 
+
−
/*兼容*/
+
−
/*--1600--*/
+
−
@media only screen and (max-width: 1680px) {
+
−
.Content{ height: 460px;}
+
−
}
+
−
 
+
−
/*--1440--*/
+
−
@media only screen and (max-width: 1440px) {
+
−
.Content{ height: 500px;}
+
−
}
+
−
 
+
−
/*--1280--*/
+
−
@media only screen and (max-width: 1280px) {
+
 
html{ font-size: 50%;}
 
html{ font-size: 50%;}
−
.header .nav .mainnav span{ margin-bottom: 20px;}
+
.header .logo span{ margin: 15px 0;}
−
.Content{ height: 455px;}
+
.header .nav .Project{ width: 100px;}
−
}
+
.header .nav .Application{ width: 100px;}
−
 
+
.header .nav .Human_Practices{ width: 140px;}
−
/*--1150--*/
+
.header .nav .Achievement{ width: 120px;}
−
@media only screen and (max-width: 1280px) {
+
.header .nav .Team{ width: 95px;}
−
html{ font-size: 50%;}
+
.header .nav .mainnav span{ padding-top: 8.5px; margin-bottom: 21px;}
−
.header .nav .Team{ width: 100px;}
+
−
.header .nav .Project{ width: 85px;}
+
−
.header .nav .Parts{ width: 110px;}
+
−
.header .nav .Human_Practices{ width: 130px;}
+
−
.header .nav .Awards{ width: 120px;}
+
−
.header .nav .mainnav span{ margin-bottom: 21.5px;}
+
−
.Content{ height: 455px;}
+
−
}
+
−
 
+
−
/*--1024--*/
+
−
@media only screen and (max-width: 1024px) {
+
−
html{ font-size: 45%;}
+
−
.header .logo span{ margin-top: 18px;}
+
−
.header .nav .Team{ width: 100px;}
+
−
.header .nav .Project{ width: 90px;}
+
−
.header .nav .Parts{ width: 115px;}
+
−
.header .nav .Human_Practices{ width: 135px;}
+
−
.header .nav .Awards{ width: 120px;}
+
−
.header .nav .mainnav span{ margin-bottom: 20.5px; padding-top: 8px;}
+
−
.Content{ height: 400px;}
+
 
}
 
}

Latest revision as of 10:53, 29 October 2017

body{ min-width: 1024px; min-height: 489px; position: relative;}

.SSTi-SZGD img{ width: 100%;}

/*custom header*/ .header{ position: absolute; margin-top: 15px;} .header .nav .Home span{ color: #FAEE0D;}


/*--1190--*/ @media only screen and (max-width: 1190px) { html{ font-size: 50%;} .header .logo span{ margin: 15px 0;} .header .nav .Project{ width: 100px;} .header .nav .Application{ width: 100px;} .header .nav .Human_Practices{ width: 140px;} .header .nav .Achievement{ width: 120px;} .header .nav .Team{ width: 95px;} .header .nav .mainnav span{ padding-top: 8.5px; margin-bottom: 21px;} }