Tip: you can modify some code before running
<p><style type="text/css">* {Margin: 0; padding: 0} body {margin: 0 auto;} ul {list-style-type: none }. newTab {width: 230px; margin: 0 auto }. newTit {width: 100%; height: 40px; float: left; line-height: 40px; color: #444444; font-size: 16px ;}. newTit li {width: 115px; height: 40px; float: left; background: url (images/sy_04.jpg) no-repeat; text-align: center; cursor: pointer }. newTit li. active {background: url (images/sy_03.jpg) no-repeat; color: # ff6701 }. newCon {width: 228px; height: 140px; float: left; border: 1px # e6e6e6 solid; border-top: none }. newConX {width: 100%; float: left; display: none }. newConX p {width: 100%; float: left; line-height: 28px; font-size: 12px }. newConX p label {width: 100px; float: left; margin-left: 10px; display: inline; color: # 5c5c5c }. newConX p label span {float: left ;}. newConX p label a {float: left }. newConXp {text-indent: 0.95em }. tabOrg {color: # ff6701}. tabOrg {color: # ff6701; text-decoration: none} a: hover. tabOrg {color: # ff6701; text-decoration: none}</style></p><div class="newTab"><ul id="newTit" class="newTit"> <li class="active">Buyer Center</li> <li>Seller Center</li></ul><div id="newCon" class="newCon"><div class="newConX"><p><label>Pending orders (10)</label> <label>Transaction to be evaluated (10)</label> <label>Order to be confirmed (10)</label></p><p class="newConXp">The purchase quota for this month is 17826.35 RMB (20 RMB)</p><p class="newConXp">This year's purchase quota of 17826.35 yuan (back to 100 yuan)</p><p class="newConXp">Your purchase amount ranks 1st and the reward is 100 yuan!</p></div><div class="newConX"><p><label>Pending orders (10)</label> <label>Goods to be approved (10)</label> <label>Item not updated (10)</label></p><p class="newConXp">The purchase quota for this month is 17826.35 RMB (20 RMB)</p><p class="newConXp">This year's purchase quota of 17826.35 yuan (back to 100 yuan)</p><p class="newConXp">Your purchase amount ranks 1st and the reward is 100 yuan!</p></div></div></div><script type="text/javascript">Window. onload = function () {var tit = document. getElementById ('newtid '). getElementsByTagName ('Lil'); var con = document. getElementById ('newcon '). getElementsByTagName ('div '); var I = 0; for (I = 0; I<tit.length;i++){tit[i].index=i;tit[i].onclick=function(){for(i=0;i<tit.length;i++){tit[i].className='';con[i].style.display='none';}this.className='active';con[this.index].style.display='block';}}}</script></td> </tr></table>
Tip: you can modify some code before running