Team:NYMU-Taipei/gallery.css
From 2014.igem.org
(Difference between revisions)
m |
|||
(15 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | |||
.main-img{ | .main-img{ | ||
- | height: | + | height: 450px; |
- | width: | + | width: 800px; |
- | border: solid | + | border: solid 10px rgb(255, 255, 255); |
+ | box-shadow: 2px 2px 6px 2px rgb(143, 121, 121); | ||
margin: 10px auto; | margin: 10px auto; | ||
white-space: nowrap; | white-space: nowrap; | ||
Line 9: | Line 9: | ||
position:relative; | position:relative; | ||
} | } | ||
- | |||
.g-thumb{ | .g-thumb{ | ||
text-align:center; | text-align:center; | ||
+ | max-width: 900px; | ||
+ | margin: 0 auto; | ||
} | } | ||
.g-thumb>img{ | .g-thumb>img{ | ||
- | width: | + | width: 96px; |
- | height: | + | height: 54px; |
margin: 5px auto; | margin: 5px auto; | ||
+ | border: 1px rgb(0,0,0) solid; | ||
+ | opacity: 0.7; | ||
+ | } | ||
+ | .g-thumb>img:hover{ | ||
+ | opacity: 1; | ||
} | } | ||
- | .main-img>div{ | + | .main-img>div:not(.g-left):not(.g-right){ |
height: 100%; | height: 100%; | ||
width: 100%; | width: 100%; | ||
Line 26: | Line 32: | ||
} | } | ||
- | + | .g-left{ | |
width: 40px; | width: 40px; | ||
height: 40px; | height: 40px; | ||
position: absolute; | position: absolute; | ||
- | |||
right: 0; | right: 0; | ||
top: 45%; | top: 45%; | ||
+ | z-index:5; | ||
+ | background: url('/wiki/images/0/09/NYMU14_next.png') no-repeat center; | ||
+ | background-color: rgba(0,0,0,0.6); | ||
+ | border-radius: 20px; | ||
+ | background-size: 30%; | ||
+ | } | ||
+ | .g-right{ | ||
+ | width: 40px; | ||
+ | height: 40px; | ||
+ | position: absolute; | ||
+ | background: gray; | ||
+ | left: 0; | ||
+ | top: 45%; | ||
+ | z-index: 5; | ||
+ | background: url('/wiki/images/8/8c/NYMU14_prev.png') no-repeat center; | ||
+ | background-color: rgba(0,0,0,0.6); | ||
+ | border-radius: 20px; | ||
+ | background-size: 30%; | ||
} | } |
Latest revision as of 02:55, 17 October 2014
.main-img{
height: 450px; width: 800px; border: solid 10px rgb(255, 255, 255); box-shadow: 2px 2px 6px 2px rgb(143, 121, 121); margin: 10px auto; white-space: nowrap; overflow:hidden; position:relative;
} .g-thumb{
text-align:center; max-width: 900px; margin: 0 auto;
}
.g-thumb>img{
width: 96px; height: 54px; margin: 5px auto; border: 1px rgb(0,0,0) solid; opacity: 0.7;
} .g-thumb>img:hover{
opacity: 1;
}
.main-img>div:not(.g-left):not(.g-right){
height: 100%; width: 100%; position:absolute;
}
.g-left{
width: 40px; height: 40px; position: absolute; right: 0; top: 45%; z-index:5; background: url('/wiki/images/0/09/NYMU14_next.png') no-repeat center; background-color: rgba(0,0,0,0.6); border-radius: 20px; background-size: 30%;
} .g-right{
width: 40px; height: 40px; position: absolute; background: gray; left: 0; top: 45%; z-index: 5; background: url('/wiki/images/8/8c/NYMU14_prev.png') no-repeat center; background-color: rgba(0,0,0,0.6); border-radius: 20px; background-size: 30%;
}