Team:SUSTC-Shenzhen-A/tutorial test

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<HEAD>
-
<TITLE>JS+CSS仿网易的选项卡TAB标签样式_网页代码站(www.6a8a.com)</TITLE>
 
<STYLE type=text/css>
<STYLE type=text/css>
BODY {
BODY {
Line 9: Line 8:
}
}
#con {
#con {
-
FONT-SIZE: 12px; MARGIN: 0px auto; WIDTH: 600px
+
FONT-SIZE: 12px; MARGIN: 0px auto; WIDTH: 550px
}
}
#tags {
#tags {
-
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 10px; WIDTH: 400px; PADDING-TOP: 0px; HEIGHT: 40px
+
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 0px; WIDTH: 600px; PADDING-TOP: 0px; HEIGHT: 40px
}
}
#tags LI {
#tags LI {
-
BACKGROUND: url(http://www.6a8a.com/images/tagleft.gif) no-repeat left bottom; FLOAT: left; MARGIN-RIGHT: 1px; LIST-STYLE-TYPE: none; HEIGHT: 40px
+
BACKGROUND: url(http://taftproot.gotoip2.com/ld/images/tagleft.gif) no-repeat left bottom; FLOAT: left; MARGIN-RIGHT: 1px; LIST-STYLE-TYPE: none; HEIGHT: 40px
}
}
#tags LI A {
#tags LI A {
-
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: url(http://www.6a8a.com/images/tagright.gif) no-repeat right bottom; FLOAT: left; PADDING-BOTTOM: 0px; COLOR: #999;LINE-HEIGHT: 23px; PADDING-TOP: 0px; HEIGHT: 23px; TEXT-DECORATION: none;FONT-SIZE: 30px
+
PADDING-RIGHT: 25px; PADDING-LEFT: 25px; BACKGROUND: url(http://taftproot.gotoip2.com/ld/images/tip_bg.gif) no-repeat right bottom; FLOAT: left; PADDING-BOTTOM: 0px; COLOR: #999;LINE-HEIGHT: 23px; PADDING-TOP: 5px; HEIGHT: 23px; TEXT-DECORATION: none;FONT-SIZE: 30px
}
}
#tags LI.emptyTag {
#tags LI.emptyTag {
Line 24: Line 23:
}
}
#tags LI.selectTag {
#tags LI.selectTag {
-
BACKGROUND-POSITION: left top; MARGIN-BOTTOM: -2px; POSITION: relative; HEIGHT: 25px
+
BACKGROUND-POSITION: left top; MARGIN-BOTTOM: -2px; POSITION: relative; HEIGHT: 40px
}
}
#tags LI.selectTag A {
#tags LI.selectTag A {
Line 33: Line 32:
}
}
.tagContent {
.tagContent {
-
PADDING-RIGHT: 10px; DISPLAY: none; PADDING-LEFT: 10px; BACKGROUND: url(http://www.6a8a.com/images/bg3.gif) repeat-x; PADDING-BOTTOM: 10px; WIDTH: 576px; COLOR: #474747; PADDING-TOP: 10px; HEIGHT: 250px
+
PADDING-RIGHT: 10px; DISPLAY: none; PADDING-LEFT: 10px; BACKGROUND: url(http://www.6a8a.com/images/bg3.gif) repeat-x; PADDING-BOTTOM: 10px; COLOR: #474747; PADDING-TOP: 10px; HEIGHT: 250px
}
}
#tagContent DIV.selectTag {
#tagContent DIV.selectTag {
Line 44: Line 43:
<UL id=tags>
<UL id=tags>
   <LI><A onMouseOver="selectTag('tagContent0',this)"  
   <LI><A onMouseOver="selectTag('tagContent0',this)"  
-
   href="javascript:void(0)"> Tip  1 </A> </LI>
+
   href="javascript:void(0)"> <em><strong>Tip  1 </strong></em><strong></strong></A> </LI>
   <LI class=selectTag><A onMouseOver="selectTag('tagContent1',this)"  
   <LI class=selectTag><A onMouseOver="selectTag('tagContent1',this)"  
-
   href="javascript:void(0)"> Tip  2 </A> </LI>
+
   href="javascript:void(0)"> <em><strong>Tip  2 </strong></em><strong></strong></A> </LI>
   <LI><A onMouseOver="selectTag('tagContent2',this)"  
   <LI><A onMouseOver="selectTag('tagContent2',this)"  
-
   href="javascript:void(0)"> Tip  3  </A> </LI></UL>
+
   href="javascript:void(0)"> <em><strong>Tip  3 </strong></em><strong></strong></A> </LI>
 +
    <LI><A onMouseOver="selectTag('tagContent3',this)"
 +
  href="javascript:void(0)"> <em><strong>Tip 4 </strong></em><strong></strong></A> </LI>
 +
  </UL>
<DIV id=tagContent>
<DIV id=tagContent>
-
<DIV class=tagContent id=tagContent0>最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码!</DIV>
+
<DIV class=tagContent id=tagContent0> <table width="505" border="0">
-
<DIV class="tagContent selectTag" id=tagContent1>这时是ASP标签的内容。</DIV>
+
    <tr>
-
<DIV class=tagContent id=tagContent2>自适应宽度的标签内容。</DIV></DIV></DIV>
+
      <td width="300"><img src="img/tutorial_01.png" width="300" height="500"></td>
 +
      <td width="195"><p><strong>This is the first page after you open the  app first time. In this page, you can choice your address in order we can  choice the best server to provide the data.</strong></p></td>
 +
    </tr>
 +
  </table></DIV>
 +
<DIV class="tagContent selectTag" id=tagContent1>
 +
  <table width="505" border="0">
 +
    <tr>
 +
      <td width="300"><img src="img/tutorial_02.png" width="300" height="500"></td>
 +
      <td width="195"><p><strong>This is the first page after you open the  app first time. In this page, you can choice your address in order we can  choice the best server to provide the data.</strong></p></td>
 +
    </tr>
 +
  </table>
 +
</DIV>
 +
<DIV class=tagContent id=tagContent2>  
 +
<table width="505" border="0">
 +
    <tr>
 +
      <td width="300"><img src="img/tutorial_03.png" width="300" height="500"></td>
 +
      <td width="195"><p><strong>This is the first page after you open the  app first time. In this page, you can choice your address in order we can  choice the best server to provide the data.</strong></p></td>
 +
    </tr>
 +
  </table></DIV>
 +
<DIV class=tagContent id=tagContent3>
 +
<table width="505" border="0">
 +
    <tr>
 +
      <td width="300"><img src="img/tutorial_04.png" width="300" height="500"></td>
 +
      <td width="195"><p><strong>This is the first page after you open the  app first time. In this page, you can choice your address in order we can  choice the best server to provide the data.</strong></p></td>
 +
    </tr>
 +
  </table></DIV></DIV></DIV>
<SCRIPT type=text/javascript>
<SCRIPT type=text/javascript>
function selectTag(showContent,selfObj){
function selectTag(showContent,selfObj){

Revision as of 08:09, 16 September 2012

This is the first page after you open the app first time. In this page, you can choice your address in order we can choice the best server to provide the data.

This is the first page after you open the app first time. In this page, you can choice your address in order we can choice the best server to provide the data.

This is the first page after you open the app first time. In this page, you can choice your address in order we can choice the best server to provide the data.

This is the first page after you open the app first time. In this page, you can choice your address in order we can choice the best server to provide the data.