Difference between revisions of "Template:CPU CHINA/common CSS"
| Line 24: | Line 24: | ||
font-family:"CABIN-REGULAR","Arial","Microsoft YaHei","黑体","宋体",sans-serif; | font-family:"CABIN-REGULAR","Arial","Microsoft YaHei","黑体","宋体",sans-serif; | ||
} | } | ||
| − | + | #contain{ | |
| − | margin-top:- | + | margin-top:-12px; |
padding:0 3% 10%; | padding:0 3% 10%; | ||
width: 100%; | width: 100%; | ||
| Line 34: | Line 34: | ||
.background{ | .background{ | ||
| − | + | position: fixed; | |
| − | + | width: 100%; | |
| − | + | top: 0; | |
| − | + | z-index: -1; | |
| − | } | + | } |
| − | + | #title{ | |
position:fixed; | position:fixed; | ||
top: 15%; | top: 15%; | ||
| Line 51: | Line 51: | ||
@media screen and (max-width:1030px) { | @media screen and (max-width:1030px) { | ||
| − | + | #title{ | |
top:10%; | top:10%; | ||
font-size: 700%; | font-size: 700%; | ||
| Line 58: | Line 58: | ||
} | } | ||
@media screen and (max-width:930px){ | @media screen and (max-width:930px){ | ||
| − | + | #title{ | |
top:10%; | top:10%; | ||
font-size: 600%; | font-size: 600%; | ||
| Line 65: | Line 65: | ||
} | } | ||
@media screen and (max-width:830px) { | @media screen and (max-width:830px) { | ||
| − | + | #title{ | |
top:10%; | top:10%; | ||
font-size: 500%; | font-size: 500%; | ||
| Line 72: | Line 72: | ||
} | } | ||
@media screen and (max-width:730px) { | @media screen and (max-width:730px) { | ||
| − | + | #title{ | |
top:10%; | top:10%; | ||
font-size: 450%; | font-size: 450%; | ||
| Line 78: | Line 78: | ||
} | } | ||
@media screen and (max-width:630px) { | @media screen and (max-width:630px) { | ||
| − | + | #title{ | |
top:5%; | top:5%; | ||
font-size: 400%; | font-size: 400%; | ||
| Line 85: | Line 85: | ||
} | } | ||
@media screen and (max-width:530px) { | @media screen and (max-width:530px) { | ||
| − | + | #title{ | |
top:4%; | top:4%; | ||
font-size: 350%; | font-size: 350%; | ||
| Line 92: | Line 92: | ||
} | } | ||
@media screen and (max-width:450px) { | @media screen and (max-width:450px) { | ||
| − | + | #title{ | |
font-size: 300%; | font-size: 300%; | ||
} | } | ||
| Line 98: | Line 98: | ||
} | } | ||
@media screen and (max-width:400px){ | @media screen and (max-width:400px){ | ||
| − | + | #title{ | |
font-size: 250%; | font-size: 250%; | ||
} | } | ||
| Line 104: | Line 104: | ||
@media screen and (max-width:350px){ | @media screen and (max-width:350px){ | ||
| − | + | #title{ | |
font-size: 200%; | font-size: 200%; | ||
} | } | ||
} | } | ||
Revision as of 14:46, 16 August 2021
@font-face{
font-family: MONTSERRAT-BLACK1;
src: url("https://static.igem.org/mediawiki/2021/0/04/T--CPU_CHINA--MONTSERRAT-BLACK1.woff")format('woff');
}
@font-face{
font-family: MONTSERRAT-BLACKITALIC2;
src: url("https://static.igem.org/mediawiki/2021/d/d4/T--CPU_CHINA--MONTSERRAT-BLACKITALIC2.woff")format('woff');
}
@font-face{
font-family: CABIN-REGULAR;
src: url("https://static.igem.org/mediawiki/2021/b/b3/T--CPU_CHINA--CABIN-REGULAR.woff")format('woff');
}
@font-face{
font-family: CABIN-ITALIC;
src: url("https://static.igem.org/mediawiki/2021/7/75/T--CPU_CHINA--CABIN-ITALIC.woff")format('woff');
}
body{
width: 100%; font-family:"CABIN-REGULAR","Arial","Microsoft YaHei","黑体","宋体",sans-serif;
}
- contain{
margin-top:-12px; padding:0 3% 10%; width: 100%; background-color: rgb(250,250,250); z-index: 1; box-sizing: border-box;
}
.background{
position: fixed;
width: 100%;
top: 0;
z-index: -1;
}
- title{
position:fixed; top: 15%; left: 18%; font-weight: bold; font-size: 800%; color: #FAFAFA; z-index: -1;
}
@media screen and (max-width:1030px) {
#title{
top:10%;
font-size: 700%;
}
} @media screen and (max-width:930px){
#title{
top:10%;
font-size: 600%;
}
} @media screen and (max-width:830px) {
#title{
top:10%;
font-size: 500%;
}
} @media screen and (max-width:730px) {
#title{
top:10%;
font-size: 450%;
}
} @media screen and (max-width:630px) {
#title{
top:5%;
font-size: 400%;
}
} @media screen and (max-width:530px) {
#title{
top:4%;
font-size: 350%;
}
} @media screen and (max-width:450px) {
#title{
font-size: 300%;
}
} @media screen and (max-width:400px){
#title{
font-size: 250%;
}
}
@media screen and (max-width:350px){
#title{
font-size: 200%;
}
}