Team:Korea U Seoul/template/banner
From 2013.igem.org
(Difference between revisions)
m (edit banner's height to 160px) |
|||
(108 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
+ | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> | ||
+ | |||
+ | |||
+ | <style> | ||
+ | .content_wrapper{ | ||
+ | top: -10px; | ||
+ | width: 80%; min-width:1000px; max-width:1000px; margin:0 auto;overflow: auto; background-color:#FFFFFF; padding: 0 20px; min-height: 1000px; | ||
+ | background-image: url('https://static.igem.org/mediawiki/2013/6/6e/Natural_paper.png'); | ||
+ | } | ||
+ | .title{ | ||
+ | width: 100%; | ||
+ | margin-top : 40px; | ||
+ | margin-bottom: 20px; | ||
+ | } | ||
+ | .title > .title_ {color: #8b0027; font-weight: bold; font-size: 15pt; margin-top: 10px;} | ||
+ | .title > .left_line{float: left; width: 30%; background-color: #8B0029; height: 5px;} | ||
+ | .title > .right_line{float: left; width: 70%; background-color: #eb89a5; height: 2px;} | ||
+ | |||
+ | .content_{ | ||
+ | margin-top: 20px; | ||
+ | font-size: 10pt;padding-bottom:40px; | ||
+ | line-height: 130%; | ||
+ | } | ||
+ | .content_ .float_img{ | ||
+ | float: right; | ||
+ | width: 150px; | ||
+ | margin: 10px; | ||
+ | } | ||
+ | .image_line {margin-top: 20px; text-align: center;} | ||
+ | .image_line img{ | ||
+ | height: 150px; | ||
+ | margin-right: 3%; | ||
+ | } | ||
+ | p:first-child:first-letter{font-weight: bold; font-size: 150%;} | ||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
<style> | <style> | ||
/* | /* | ||
Line 24: | Line 64: | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
- | |||
} | } | ||
Line 35: | Line 74: | ||
padding: 0; | padding: 0; | ||
padding-bottom: 10px; | padding-bottom: 10px; | ||
+ | } | ||
+ | #catlinks { | ||
+ | display: none; | ||
} | } | ||
.visualClear { | .visualClear { | ||
Line 44: | Line 86: | ||
#top-section { | #top-section { | ||
background-color: #8b0029; | background-color: #8b0029; | ||
- | + | height:18px ! important; /* 메인 배너 이미지 높이 */ | |
- | height: | + | |
margin: 0px; | margin: 0px; | ||
margin-left: auto; | margin-left: auto; | ||
Line 53: | Line 94: | ||
border: none; | border: none; | ||
position: relative; | position: relative; | ||
- | width: | + | width: 100%; |
} | } | ||
Line 115: | Line 156: | ||
} | } | ||
- | + | #header { | |
+ | width: 100%; | ||
+ | height:90px; | ||
+ | position:relative; | ||
+ | z-index:999; | ||
+ | background:#d8d3cd; | ||
+ | } | ||
+ | #nav { | ||
+ | margin: 0 auto; | ||
+ | background:#d8d3cd; | ||
+ | width: 1100px | ||
+ | } | ||
+ | #nav ul, #nav li { | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #nav ul{ | ||
+ | } | ||
+ | #nav > ul > li > a > img{ | ||
+ | height: 40px; | ||
+ | margin-bottom: 10px; | ||
+ | margin-top: 10px; | ||
+ | } | ||
+ | #nav li { | ||
+ | position:relative; | ||
+ | list-style:none; | ||
+ | float:left; | ||
+ | margin:0px; /* 0이엇음 */ | ||
+ | padding:0px 0px 0px 0px; | ||
+ | width: 180px; | ||
+ | } | ||
+ | #nav li:hover{ | ||
+ | background-color: #8B0029 | ||
+ | } | ||
+ | |||
+ | #nav a { | ||
+ | display:block; | ||
+ | font-weight:bold; | ||
+ | text-decoration:none; | ||
+ | margin:0px; | ||
+ | padding:5px 15px 5px 15px; /* 어디까지 hover 효과 먹히는지 */ | ||
+ | } | ||
+ | #nav li ul { | ||
+ | position:absolute; | ||
+ | top:92px; /* 서브가 아래로 열리게하는 */ | ||
+ | display:none; | ||
+ | text-align: center; | ||
+ | background-color: #8B0029 | ||
+ | } | ||
+ | #nav li.on ul { | ||
+ | display:block; | ||
+ | } | ||
+ | /* color */ | ||
+ | #header {background:#8b0029;} | ||
+ | #nav a {background:#8b0029; color:#ffffff;} | ||
+ | #nav .on a, | ||
+ | #nav li li a {background:#d8d3cd; color:#8b0029;} | ||
+ | #nav > ul > li > ul > li :hover{ | ||
+ | background-color: #8B0029; | ||
+ | color: #FFFFFF; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | /* contents */ | ||
+ | #content { | ||
+ | position: relative; | ||
+ | width: 100%; | ||
+ | margin: 0 auto; | ||
+ | padding: 5px 0px 5px 0px; | ||
+ | color: black; | ||
+ | border-left: none; | ||
+ | border-right: none; | ||
+ | line-height: 1.5em; | ||
+ | z-index: 2; | ||
+ | } | ||
+ | </style> | ||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div id="header"> | ||
+ | <div id="nav"> | ||
+ | <ul> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul"><img src="https://static.igem.org/mediawiki/2013/3/31/Koreauseoul_logo.png"><br />Home</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Team/Korea_University"><img src="https://static.igem.org/mediawiki/2013/1/13/Introduction.png"><br />Team</a> | ||
+ | <ul> | ||
+ | <!--<li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Team/Korea_University">Korea University</a> | ||
+ | </li>--> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Team/Korea_University">Our members</a> | ||
+ | </li> | ||
+ | <li><a href="https://igem.org/Team.cgi?year=2013&team_name=Korea_U_Seoul">Official Team Profile</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Description"><img src="https://static.igem.org/mediawiki/2013/0/00/Review.png"><br />Project</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Description">Description</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Design">Design & Parts</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Protocols">Protocol</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Result">Result</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Project/Application">Application & Improvement</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Notebook"><img src="https://static.igem.org/mediawiki/2013/7/7d/Howto.png"><br />Notebook</a> | ||
+ | </li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Human_Practice/Ownership_Innovation"><img src="https://static.igem.org/mediawiki/2013/d/de/Mypage.png"><br />Human Practice</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Human_Practice/Ownership_Innovation">Ownership & Innovation</a> | ||
+ | </li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Human_Practice/Outreach">Outreach</a> | ||
+ | </li> | ||
+ | <li><a href="https://2013.igem.org/Team:Korea_U_Seoul/Human_Practice/Safety">Safety Questions</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://igem.org/"><img src="https://static.igem.org/mediawiki/2013/c/ce/Logos.png"><br />iGEM</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | <script> | ||
+ | $('#nav li').bind('mouseenter keyup mouseleave', function() { | ||
+ | $(this) .addClass('on').siblings().removeClass(); | ||
+ | |||
+ | $(this).unbind('mouseenter keyup mouseleave', function(){ | ||
+ | |||
+ | }) | ||
+ | }); | ||
+ | </script> | ||
+ | </body> | ||
</html> | </html> |
Latest revision as of 22:24, 27 September 2013