Difference between revisions of "Template:CGU Taiwan/cgustyle"

 
(44 intermediate revisions by 2 users not shown)
Line 34: Line 34:
 
text-align: left;
 
text-align: left;
 
position: absolute;
 
position: absolute;
left: 100px;
+
left: 5vw;
 
width: 307px;
 
width: 307px;
 
height: 100px;
 
height: 100px;
Line 68: Line 68:
 
background-color: #f1f1f1;
 
background-color: #f1f1f1;
 
}
 
}
 +
  
 
.dropdown:hover .dropdown-content {
 
.dropdown:hover .dropdown-content {
 +
    display: block;
 +
}
 +
 +
/*right dropdown*/
 +
nav li.dropdown2 {
 +
    display: inline-block;
 +
}
 +
 +
.dropdown2-content {
 +
    display: none;
 +
    position: absolute;
 +
    right: 1vw;
 +
    margin-top: 0;
 +
    background-color: #f9f9f9;
 +
    min-width: 160px;
 +
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
    z-index: 1;
 +
}
 +
 +
.dropdown2-content a {
 +
    color: black;
 +
    padding: 12px 16px;
 +
    text-decoration: none;
 +
    display: block;
 +
    text-align: right;
 +
}
 +
 +
.dropdown2-content a:hover {
 +
background-color: #f1f1f1;
 +
}
 +
 +
.dropdown2:hover .dropdown2-content {
 
     display: block;
 
     display: block;
 
}
 
}
Line 92: Line 125:
 
.square{
 
.square{
 
     position:fixed;
 
     position:fixed;
     top:20%;
+
     top:18.75%;
     left:80%;
+
     left:81.5%;
 
     display:inline-block;
 
     display:inline-block;
 
     float:right;
 
     float:right;
     height:40vw;
+
     height:37.5vw;
     width:40vw;
+
     width:37.5vw;
 
     background:url(https://static.igem.org/mediawiki/2017/8/89/Cgusquare_2.png) top left no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/8/89/Cgusquare_2.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
Line 107: Line 140:
 
.leftMenuBack{
 
.leftMenuBack{
 
     position:fixed;
 
     position:fixed;
     top:18%;
+
     top:24.125%;
 
     display:inline-block;
 
     display:inline-block;
 
     float:left;
 
     float:left;
     width:10vw;
+
     width:15vw;
    background:url(https://static.igem.org/mediawiki/2017/7/70/LeftMenuBack.png) top left no-repeat;
+
  height:66.75vw;  background:url(https://static.igem.org/mediawiki/2017/7/70/LeftMenuBack.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
     z-index:-2;
 
     z-index:-2;
Line 118: Line 151:
 
.leftMenu{
 
.leftMenu{
 
     position:fixed;
 
     position:fixed;
     top:18%;
+
     top:24.125%;
 
     display:inline-block;
 
     display:inline-block;
 
     float:left;
 
     float:left;
width:10vw;
+
width:15vw;
height:auto;
+
height:66.75vw;
 
     /*null back ground*/
 
     /*null back ground*/
 
     background:url(https://static.igem.org/mediawiki/2017/0/0d/Null.png) top left no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/0/0d/Null.png) top left no-repeat;
Line 148: Line 181:
 
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) top left no-repeat;
 
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) top left no-repeat;
 
float:left;
 
float:left;
width:20vw;
+
width:15vw;
height:auto;
+
height:66.75vw;
 
text-align:center;
 
text-align:center;
 
text-indent:-300px;
 
text-indent:-300px;
Line 156: Line 189:
  
 
.leftMenu li.left1 a {
 
.leftMenu li.left1 a {
width:10vw;
+
width:15vw;
height:auto;
+
height:8.925vw;
 
background:url(https://static.igem.org/mediawiki/2017/c/c7/LeftMenuBio.png) top left no-repeat;
 
background:url(https://static.igem.org/mediawiki/2017/c/c7/LeftMenuBio.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
Line 163: Line 196:
  
 
.leftMenu li.left2 a {
 
.leftMenu li.left2 a {
width:10vw;
+
width:15vw;
height:auto;
+
height:7.154vw;
 
background:url(https://static.igem.org/mediawiki/2017/e/e3/LeftMenuModel.png) top left no-repeat;
 
background:url(https://static.igem.org/mediawiki/2017/e/e3/LeftMenuModel.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
 
.leftMenu li.left3 a {
 
.leftMenu li.left3 a {
width:10vw;
+
width:15vw;
height:auto;
+
height:7.825vw;
 
background:url(https://static.igem.org/mediawiki/2017/2/2f/LeftMenuDevice.png) top left no-repeat;
 
background:url(https://static.igem.org/mediawiki/2017/2/2f/LeftMenuDevice.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
Line 176: Line 209:
  
 
.leftMenu li.left4 a {
 
.leftMenu li.left4 a {
width:10vw;
+
width:15vw;
height:auto;
+
height:9.37vw;
 
background:url(https://static.igem.org/mediawiki/2017/6/68/LeftMenuMarketing.png) top left no-repeat;
 
background:url(https://static.igem.org/mediawiki/2017/6/68/LeftMenuMarketing.png) top left no-repeat;
 
     background-size:contain;
 
     background-size:contain;
Line 183: Line 216:
  
 
.leftMenu li.left1 a:hover {
 
.leftMenu li.left1 a:hover {
     width:10vw;
+
     width:15vw;
height:auto;
+
height:8.925vw;
 
     background:url(https://static.igem.org/mediawiki/2017/a/ae/LeftMenuBioB.png) left top no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/a/ae/LeftMenuBioB.png) left top no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
 
.leftMenu li.left2 a:hover {
 
.leftMenu li.left2 a:hover {
     width:10vw;
+
     width:15vw;
height:auto;
+
height:7.154vw;
 
     background:url(https://static.igem.org/mediawiki/2017/2/2f/LeftMenuModelB.png) left top no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/2/2f/LeftMenuModelB.png) left top no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
.leftMenu li.left2 a:hover {
+
.leftMenu li.left3 a:hover {
     width:10vw;
+
     width:15vw;
height:auto;
+
height:7.825vw;
 
     background:url(https://static.igem.org/mediawiki/2017/4/48/LeftMenuDeviceB.png) left top no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/4/48/LeftMenuDeviceB.png) left top no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
.leftMenu li.left2 a:hover {
+
.leftMenu li.left4 a:hover {
     width:10vw;
+
     width:15vw;
height:auto;
+
height:9.37vw;
 
     background:url(https://static.igem.org/mediawiki/2017/3/3f/LeftMenuMarketingB.png) left top no-repeat;
 
     background:url(https://static.igem.org/mediawiki/2017/3/3f/LeftMenuMarketingB.png) left top no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
 +
/* left menu end */
  
  
 +
/* background animation end */
  
 
+
.description{
 
+
margin:auto;
/* right menu start */
+
padding-top: 50px;
.rightmenuBack{
+
padding-left: 15vw;
    position:fixed;
+
padding-right: 15vw;
    top:18%;
+
    display:inline-block;
+
    float:left;
+
    width:199.5px;
+
    height:430px;
+
    background:url(https://static.igem.org/mediawiki/2017/6/69/Cgurightmenu-back.png) top left no-repeat;
+
    background-size:contain;
+
    z-index:-2;
+
 
}
 
}
  
.rightmenu{
+
h1{
    position:fixed;
+
color:orange;
    top:18%;
+
    display:inline-block;
+
    float:left;
+
width:199.5px;
+
height:143.33px;
+
    background-size:contain;
+
    z-index:1;
+
/* transition: 1s; */
+
}
+
 
+
.rightmenu ul {
+
display: inline-block;
+
 
text-align:center;
 
text-align:center;
margin:0px;
 
padding:0px;
 
list-style:none;
 
font-size:13px;
 
 
}
 
}
  
.rightmenu li {
+
h2{
float:left;
+
color:orange;
}
+
 
+
.rightmenu li a {
+
display:block;
+
text-decoration:none;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) top left no-repeat;
+
float:left;
+
width:199px;
+
height:143.33px;
+
 
text-align:center;
 
text-align:center;
text-indent:-300px;
+
font-family: '微軟正黑體';
margin:0px;
+
 
}
 
}
  
.rightmenu li.right1 a {
+
h3{
width:199px;
+
height:143.33px;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) top left no-repeat;
+
}
+
 
+
.rightmenu li.right2 a {
+
width:199px;
+
height:143.33px;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) 0px -143.33px no-repeat;
+
}
+
 
+
.rightmenu li.right3 a {
+
width:199px;
+
height:143.33px;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) 0px -286.66px no-repeat;
+
}
+
 
+
.rightmenu li.right1 a:hover {
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) -199.5px 0px no-repeat;
+
}
+
 
+
.rightmenu li.right2 a:hover {
+
width:199px;
+
height:143.33px;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) -199.5px -143.33px no-repeat;
+
}
+
 
+
.rightmenu li.right3 a:hover {
+
width:199px;
+
height:143.33px;
+
background:url(https://static.igem.org/mediawiki/2017/7/7c/Cgurightmenu.png) -199.5px -286.66px no-repeat;
+
}
+
 
+
 
+
/* right menu end */
+
 
+
/* background animation end */
+
 
+
.description{
+
margin:auto;
+
padding-top: 50px;
+
padding-left: 100px;
+
padding-right: 100px;
+
}
+
 
+
h1{
+
 
color:orange;
 
color:orange;
 
text-align:center;
 
text-align:center;
 +
font-family: '微軟正黑體';
 
}
 
}
 +
  
 
.description p{
 
.description p{
 
margin:auto;
 
margin:auto;
 
padding-top: 20px;
 
padding-top: 20px;
padding-left: 120px;
+
padding-left: 3vw;
padding-right: 120px;
+
padding-right: 3vw;
         font-size: 200%;
+
         font-size: 250%;
 
}
 
}
  
Line 338: Line 295:
  
 
footer ul li{
 
footer ul li{
display:inline-block;
+
    display:inline-block;
text-decoration: none;
+
    text-decoration: none;
font-size: 15px;
+
    font-size: 15px;
font-family: '微軟正黑體';
+
    font-family: '微軟正黑體';
 
}
 
}
  

Latest revision as of 12:36, 10 December 2017