设为首页优惠IDC收藏本站六狼博客六狼论坛
开启辅助访问 切换到窄版

六狼论坛

 找回密码
 立即注册

QQ登录

只需一步，快速开始

新浪微博账号登陆

只需一步，快速开始

搜索
六狼论坛»首页 › WEB前端 › Html/Css › 简单选项卡制作方式
返回列表 发新帖
查看: 25|回复: 0

简单选项卡制作方式

[复制链接]
jhlovett

升级  88.33%

147

主题

147

主题

147

主题

举人

Rank: 3Rank: 3

积分
465
 楼主| 发表于 2013-2-7 14:33:40 | 显示全部楼层 |阅读模式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript">function setThisDisplay(id){try{var tabItem=document.getElementById(id);var btnItem=document.getElementById("btn"+id);var tabArr=["EmployeeInfo","OrganizationInfo","SysInfo","RoleInfo","PersonnelInfo"];for(var i=0;i<tabArr.length;i++){if(tabItem.id!=tabArr[i]){document.getElementById(tabArr[i]).style.display='none';}else{tabItem.style.display='';}}var btnArr=["btnEmployeeInfo","btnOrganizationInfo","btnSysInfo","btnRoleInfo","btnPersonnelInfo"];for(var i=0;i<btnArr.length;i++){if(btnItem.id==btnArr[i]){btnItem.bgColor='white';}else{document.getElementById(btnArr[i]).bgColor='';}}}catch(argument){}}</script><style type="text/css"><!--.tabTitle {text-align: center;cursor:hand;}--></style></head><body leftmargin="0" bottommargin="0" rightmargin="0" topmargin="0"><table width="100%" border="0" cellpadding="0" cellspacing="0" height="100%">  <tr>    <td height="51" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">      <tr  bgcolor="lightgrey" >        <td height="50">   <font size=3><b>张三        </b></font>        <br />           添加/修改人员信息        </td>      </tr>    </table></td>  </tr>  <tr>    <td height="35"  valign="top" bgcolor="F0F0F0">    <br />    <table width="100%" border="0" cellpadding="0" cellspacing="0" height="35">      <tr >        <td width="5%"> </td>        <td  id="btnEmployeeInfo"  align="center" nowrap bgcolor="white" class="tabTitle">基本信息</td>        <td  id="btnOrganizationInfo"   align="center" nowrap class="tabTitle">组织结构</td>        <td  id="btnSysInfo"   align="center" nowrap class="tabTitle">系统设置</td>        <td  id="btnRoleInfo"   align="center" nowrap class="tabTitle">角色和权限</td>        <td  id="btnPersonnelInfo"   align="center" nowrap class="tabTitle">人事档案</td>        <td width="40%"> </td>      </tr>    </table></td>  </tr>  <tr bgcolor="F0F0F0">  <td height="370" valign="top">  <!--基本信息-->  <table id="EmployeeInfo" width="95%" height="333" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="white" >    <tr>      <td>基本信息</td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>  </table>   <!--组织结构-->  <table id="OrganizationInfo" width="95%" height="333" border="0" align="center" cellpadding="0" cellspacing="0"  style="display:none;" bgcolor="white" >    <tr>      <td>组织结构</td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>  </table>   <!--系统设置-->  <table id="SysInfo" width="95%" height="333" border="0" align="center" cellpadding="0" cellspacing="0"  style="display:none;" bgcolor="white" >    <tr>      <td>系统设置</td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>  </table>   <!--角色与权限-->  <table id="RoleInfo" width="95%" style="display:none;" height="333" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="white">    <tr>      <td>角色与权限</td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>  </table>    <!--人事档案-->  <table id="PersonnelInfo" width="95%" style="display:none;" height="333" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="white">    <tr>      <td>人事档案</td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>    <tr>      <td> </td>      <td> </td>      <td> </td>    </tr>  </table>  </td></tr>  <tr bgcolor="F0F0F0"  height="135">  <td></td>  </tr></table></body></html> 
回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表