Difference between revisions of "Team:SSTi-SZGD/css/Description"
| Line 1: | Line 1: | ||
| − | body{ min-width: | + | body{ min-width: 1024px; min-height: 465px; position: relative;} |
.SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/3/3d/SSTi-SZGD_banner.jpeg) no-repeat 0px 0px; height: 465px; background-size: cover; padding-top: 15px;} | .SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/3/3d/SSTi-SZGD_banner.jpeg) no-repeat 0px 0px; height: 465px; background-size: cover; padding-top: 15px;} | ||
| Line 10: | Line 10: | ||
/*Content*/ | /*Content*/ | ||
| − | .Content{ background: #EEEEEE; width: 100%; height: | + | .Content{ background: #EEEEEE; width: 100%; height: 990px;} |
| − | .Project_Introduction{ padding: 60px | + | .Project_Introduction{ padding: 60px 0; text-align: justify; display: none; width: 1100px; margin: auto;} |
.Project_Introduction .title{ font-size: 2.8rem; color: black; margin-bottom: 25px; font-weight: bold;} | .Project_Introduction .title{ font-size: 2.8rem; color: black; margin-bottom: 25px; font-weight: bold;} | ||
| − | .Project_Introduction .top{ | + | .Project_Introduction .top{ margin-bottom: 20px; height: 340px;} |
| − | .Project_Introduction .top .img{ | + | .Project_Introduction .top .img{ height: inherit; width: 48%; float: left; background: url(https://static.igem.org/mediawiki/2017/5/59/SSTi-SZGD_background_Project_Introduction.png) no-repeat center;} |
| − | .Project_Introduction .top .content{ width: | + | .Project_Introduction .top .content{ width: 48%; float: right;} |
.Project_Introduction .top .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem;} | .Project_Introduction .top .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem;} | ||
| − | .Project_Introduction .bottom{ | + | .Project_Introduction .bottom{ margin-bottom: 20px; height: 350px;} |
| − | .Project_Introduction .bottom .img{ width: | + | .Project_Introduction .bottom .img{ width: 48%; height: inherit; float: right; background: url(https://static.igem.org/mediawiki/2017/0/02/SSTi-SZGD_background_Project_Introduction2.png) no-repeat center; margin-top: 70px;} |
| − | .Project_Introduction .bottom .content{ width: | + | .Project_Introduction .bottom .content{ width: 48%; float: left;} |
| − | .Project_Introduction .bottom .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem;} | + | .Project_Introduction .bottom .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem; list-style: none; text-decoration: none;} |
| + | |||
| + | |||
| + | |||
| + | |||
| + | /*兼容*/ | ||
| + | /*--1920--*/ | ||
| + | @media only screen and (max-width: 1920px) { | ||
| + | .header .logo span{ margin-top: 17px;} | ||
| + | .header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;} | ||
| + | } | ||
| + | |||
| + | /*--1190--*/ | ||
| + | @media only screen and (max-width: 1190px) { | ||
| + | html{ font-size: 52%;} | ||
| + | .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: 22.5px; padding-top: 6px;} | ||
| + | } | ||
| + | |||
| + | /*--1024--*/ | ||
| + | @media only screen and (max-width: 1024px) { | ||
| + | .Project_Introduction{ width: 900px;} | ||
| + | .Project_Introduction .top .content p{ margin-top: 20px;} | ||
| + | .Project_Introduction .bottom .img{ margin-top: 65px;} | ||
| + | } | ||
Revision as of 02:04, 11 September 2017
body{ min-width: 1024px; min-height: 465px; position: relative;}
.SSTi-SZGD{ background: url(
) no-repeat 0px 0px; height: 465px; background-size: cover; padding-top: 15px;}
/*自定义header*/ .header .nav .Project span,.header .nav .Project li:nth-of-type(1) a{ color: #FAEE0D;}
.topic{ position: absolute; margin: 10% 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;}
/*Content*/
.Content{ background: #EEEEEE; width: 100%; height: 990px;}
.Project_Introduction{ padding: 60px 0; text-align: justify; display: none; width: 1100px; margin: auto;}
.Project_Introduction .title{ font-size: 2.8rem; color: black; margin-bottom: 25px; font-weight: bold;}
.Project_Introduction .top{ margin-bottom: 20px; height: 340px;}
.Project_Introduction .top .img{ height: inherit; width: 48%; float: left; background: url(
) no-repeat center;}
.Project_Introduction .top .content{ width: 48%; float: right;}
.Project_Introduction .top .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem;}
.Project_Introduction .bottom{ margin-bottom: 20px; height: 350px;}
.Project_Introduction .bottom .img{ width: 48%; height: inherit; float: right; background: url(
) no-repeat center; margin-top: 70px;}
.Project_Introduction .bottom .content{ width: 48%; float: left;}
.Project_Introduction .bottom .content p{ color: #555; font-size: 1.8rem; margin-top: 35px; line-height: 2.5rem; list-style: none; text-decoration: none;}
/*兼容*/
/*--1920--*/
@media only screen and (max-width: 1920px) {
.header .logo span{ margin-top: 17px;}
.header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;}
}
/*--1190--*/ @media only screen and (max-width: 1190px) { html{ font-size: 52%;} .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: 22.5px; padding-top: 6px;} }
/*--1024--*/ @media only screen and (max-width: 1024px) { .Project_Introduction{ width: 900px;} .Project_Introduction .top .content p{ margin-top: 20px;} .Project_Introduction .bottom .img{ margin-top: 65px;} }
