Difference between revisions of "Team:China Tongji/test"
Line 1: | Line 1: | ||
− | <html> | + | <!-- <!DOCTYPE html> --> |
+ | <html lang="en"> | ||
+ | |||
<head> | <head> | ||
− | < | + | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
− | + | ||
− | + | <style type="text/css"> | |
− | + | ||
− | + | .firstHeading{ | |
− | + | display:none; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | <style type="text/css"> | + | |
− | + | ||
− | { | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | ||
− | { | + | #content{ |
− | height: | + | width:80%; |
− | + | background-color: #F0F0F0; | |
+ | } | ||
+ | |||
+ | .head{ | ||
+ | position: fixed; | ||
+ | left:0px; | ||
+ | top:18px; | ||
+ | width: 100%; | ||
+ | height: 60px; | ||
+ | background:url(https://static.igem.org/mediawiki/2015/8/8c/Team_China_Tongji-transparent-nav.png); | ||
+ | border-bottom: thin solid #CCC; | ||
+ | z-index:1000; | ||
+ | } | ||
+ | .head:hover{ | ||
+ | background: #FFF; | ||
+ | } | ||
+ | |||
+ | #navLogoLeft{ | ||
+ | float:left; | ||
+ | margin-left:15px; | ||
+ | margin-right:20px; | ||
+ | |||
+ | } | ||
+ | #navLogoLeft img{ | ||
+ | border:0px; | ||
+ | } | ||
+ | #navLogoRight{ | ||
+ | float:right; | ||
+ | margin-right:10px; | ||
+ | padding:5px; | ||
+ | } | ||
+ | #navLogoRight img{ | ||
+ | border:0px; | ||
+ | } | ||
+ | |||
+ | .nav { | ||
+ | float:left; | ||
+ | } | ||
+ | .navFirstTitle{ | ||
+ | line-height: 60px; | ||
+ | text-decoration: none; | ||
+ | padding: 10px 12px; | ||
+ | text-transform: uppercase; | ||
+ | font-family: "Comic Sans MS", cursive,Georgia; | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | .navFirstTitle:hover{ | ||
+ | background-color:#CCC; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | .bigName h1{ | ||
+ | z-index: 3; | ||
+ | color: #F0F; | ||
+ | text-align: left; | ||
+ | padding-left:100px; | ||
+ | line-height: 300px; | ||
+ | font-size: 90px; | ||
+ | font-family: Verdana, Geneva, sans-serif; | ||
+ | font-weight: bolder; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | .myContent{ | ||
+ | width:1000px; | ||
+ | margin:0px auto; | ||
+ | min-height:300px; | ||
+ | padding:0px; | ||
+ | background-color: #F0F0F0; | ||
+ | } | ||
+ | |||
+ | |||
+ | .foot{ | ||
+ | width:100%; | ||
+ | height:100px; | ||
+ | background-color:#404040; | ||
+ | } | ||
+ | .navFoot{ | ||
+ | margin-top:0px; | ||
+ | padding-top:20px; | ||
+ | } | ||
+ | .navFoot a{ | ||
+ | text-transform: uppercase; | ||
+ | text-decoration: none; | ||
+ | padding: 10px; | ||
+ | color: #D2D2D2; | ||
+ | font-family: Georgia, "Times New Roman", Times, serif; | ||
+ | font-size:12px; | ||
+ | } | ||
+ | .navFoot a:hover{ | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | .copyright{ | ||
+ | color: #8C8C8C; | ||
+ | font-family: Georgia, "Times New Roman", Times, serif; | ||
+ | font-size: 11px; | ||
} | } | ||
</style> | </style> | ||
+ | |||
+ | <script> | ||
+ | |||
+ | </script> | ||
+ | |||
</head> | </head> | ||
− | + | ||
− | < | + | |
− | + | ||
− | <div class=" | + | <!--head start--> |
− | < | + | <div class="head"> |
− | < | + | <div id="navLogoLeft"> |
+ | <a href="https://igem.org/Team.cgi?year=2015&team_name=China_Tongji"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/9/9b/China_Tongji_team-logo-60px.png"/> | ||
+ | </a> | ||
+ | </div> | ||
+ | <div class="nav"> | ||
+ | <tr> | ||
+ | <td><a class="navFirstTitle" id="Home" href="https://2015.igem.org/Team:China_Tongji">Home</a></td> | ||
+ | <td><a class="navFirstTitle" id="Project" href="https://2015.igem.org/Team:China_Tongji/Project">Project</a> | ||
+ | </td> | ||
+ | <td><a class="navFirstTitle" id="Notebook" href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></td> | ||
+ | <td><a class="navFirstTitle" id="Achivement" href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a> | ||
+ | </td> | ||
+ | <td><a class="navFirstTitle" id="Team" href="https://2015.igem.org/Team:China_Tongji/Team">Team</a></td> | ||
+ | <td><a class="navFirstTitle" id="Outreach" href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></td> | ||
+ | <td><a class="navFirstTitle" id="Safety" href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></td> | ||
+ | </tr> | ||
+ | </div> | ||
+ | <div id="navLogoRight"> | ||
+ | <a href="https://2015.igem.org/Main_Page"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/4/47/China_Tongji-logo-right.png" alt="China_Tongji"/> | ||
+ | </a> | ||
+ | </div> | ||
</div> | </div> | ||
− | |||
− | + | <!--content start--> | |
− | </ | + | <div class="bigName"> |
+ | <h1 align="left">Project</h1> | ||
+ | </div> | ||
+ | |||
+ | <div class="myContent"> | ||
+ | <p>首先是上面的菜单,最好可以像复旦这样可以随着滑动页面也跟着改动(复旦有一点问题是他们挡住了最上面的edit栏,都给移到了右边的Igem bar里面,这次应该不可以,第二个HZAU连接里面留住了edit 栏,可以参考这个),然后这一栏像他们一样可以点击的稍微大一点,醒目一点~ 然后我们也想要能在菜单左边有一块位置放我们的logo这个刚刚画好,还没有最后定稿,大概是这风格,所以整体色调和色卡选择最好可以和Logo匹配~。就是各个大标题和大背景色可不可以是那种淡淡的暖黄色~。</p> | ||
+ | <p>其次我们想要像HZAU一样主页最上面是一个那种图栏,有几张图片(一张线虫一张合影等)可以切换。</p> | ||
+ | <p>最后就是复旦他们每点进去一个主题,左边会有一栏竖着的分主题list, 会随着网页看到哪里而改变显示的位置,(像上面图片上那样)这个我们比较想要加入到我们的那些分页面里~不知道可不可以实现?</p> | ||
+ | <p> </p> | ||
+ | <p>中间内容测试内容!</p><p> </p><p> </p><p> </p>中间内容测试内容!</p><p> </p><p> </p><p> </p> | ||
+ | <p>中间内容测试内容!</p><p> </p><p> </p><p> </p> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <!--foot start--> | ||
+ | <div class="foot"> | ||
+ | <div class="navFoot" align="center"> | ||
+ | <tr align="center"> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji">Home</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Team">Team</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></td><td>|</td> | ||
+ | <td><a href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></td><td></td> | ||
+ | </tr> | ||
+ | </div> | ||
+ | <div class="copyright"><center><p>Copyright © China_Tongji iGEM 2015 | Developer: LiJunWu </p></center></div> | ||
+ | </div> | ||
+ | |||
+ | <!--当前页面指示--> | ||
+ | <script defer> | ||
+ | var keyWord = location.href.substring(39); | ||
+ | switch (keyWord) | ||
+ | { | ||
+ | case "ome": | ||
+ | document.getElementById("Home").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Project": | ||
+ | document.getElementById("Project").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Notebook": | ||
+ | document.getElementById("Notebook").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Achivement": | ||
+ | document.getElementById("Achivement").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Team": | ||
+ | document.getElementById("Team").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Outreach": | ||
+ | document.getElementById("Outreach").style.color = "#F0F"; | ||
+ | break; | ||
+ | case "Safety": | ||
+ | document.getElementById("Safety").style.color = "#F0F"; | ||
+ | break; | ||
+ | } | ||
+ | </script> | ||
+ | |||
+ | |||
</html> | </html> |
Revision as of 20:18, 20 July 2015
Project
首先是上面的菜单,最好可以像复旦这样可以随着滑动页面也跟着改动(复旦有一点问题是他们挡住了最上面的edit栏,都给移到了右边的Igem bar里面,这次应该不可以,第二个HZAU连接里面留住了edit 栏,可以参考这个),然后这一栏像他们一样可以点击的稍微大一点,醒目一点~ 然后我们也想要能在菜单左边有一块位置放我们的logo这个刚刚画好,还没有最后定稿,大概是这风格,所以整体色调和色卡选择最好可以和Logo匹配~。就是各个大标题和大背景色可不可以是那种淡淡的暖黄色~。
其次我们想要像HZAU一样主页最上面是一个那种图栏,有几张图片(一张线虫一张合影等)可以切换。
最后就是复旦他们每点进去一个主题,左边会有一栏竖着的分主题list, 会随着网页看到哪里而改变显示的位置,(像上面图片上那样)这个我们比较想要加入到我们的那些分页面里~不知道可不可以实现?
中间内容测试内容!
中间内容测试内容!
中间内容测试内容!
Copyright © China_Tongji iGEM 2015 | Developer: LiJunWu