asp.net选项卡的实现

本文展示了如何在ASP.NET中将Menu控件与MultiView组件集成使用,实现动态加载不同视图的功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

添加一个控件Menu再添加一个在标准控件中。

设计:

源:

 

Code:
  1. <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" Width="501px" StaticEnableDefaultPopOutImage="False"  
  2.   
  3.            onmenuitemclick="Menu1_MenuItemClick" BackColor="White"    
  4.   
  5.            DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="14pt"    
  6.   
  7.            ForeColor="#7C6F57" StaticSubMenuIndent="10px" Font-Bold="True">   
  8.   
  9.            <StaticSelectedStyle BackColor="Silver" ForeColor="White" />   
  10.   
  11.            <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />   
  12.   
  13.            <DynamicHoverStyle BackColor="#FF9900" ForeColor="White" />   
  14.   
  15.            <DynamicSelectedStyle BackColor="#CC9900" />   
  16.   
  17.            <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />   
  18.   
  19.            <StaticHoverStyle BackColor="#99CCFF" ForeColor="White" />   
  20.   
  21.            <Items>   
  22.   
  23.                <asp:MenuItem Value="0" Text="基本资料" Selected="True"></asp:MenuItem>   
  24.   
  25.                <asp:MenuItem Value="1" Text="联系方式"></asp:MenuItem>   
  26.   
  27.                <asp:MenuItem Value="2" Text="交友资料"></asp:MenuItem>   
  28.   
  29.                <asp:MenuItem Value="3" Text="兴趣爱好"></asp:MenuItem>   
  30.   
  31.                <asp:MenuItem Value="4" Text="自我介绍"></asp:MenuItem>   
  32.   
  33.            </Items>   
  34.   
  35.   </asp:Menu>   

设计:

 

源:

Code:
  1. <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">   
  2.   
  3.     <asp:View ID="BasicInfo" runat="server">   
  4.   
  5.         <table style="width: 100%;">   
  6.   
  7.             <tr>   
  8.   
  9.             <td>   
  10.   
  11.             tab2   
  12.   
  13.             </td>   
  14.   
  15.             </tr>   
  16.   
  17.         </table>   
  18.   
  19.     </asp:View>   
  20.   
  21.     <asp:View ID="tab2" runat="server">   
  22.   
  23.     <table>   
  24.   
  25.     <tr>   
  26.   
  27.     <td>   
  28.   
  29.     tab2   
  30.   
  31.     </td>   
  32.   
  33.     </tr>   
  34.   
  35.     </table>   
  36.   
  37.     </asp:View>   
  38.   
  39.       <asp:View ID="View1" runat="server">   
  40.   
  41.     <table>   
  42.   
  43.     <tr>   
  44.   
  45.     <td>   
  46.   
  47.     tab3   
  48.   
  49.     </td>   
  50.   
  51.     </tr>   
  52.   
  53.     </table>   
  54.   
  55.     </asp:View>   
  56.   
  57.       <asp:View ID="View2" runat="server">   
  58.   
  59.     <table>   
  60.   
  61.     <tr>   
  62.   
  63.     <td>   
  64.   
  65.     tab4   
  66.   
  67.     </td>   
  68.   
  69.     </tr>   
  70.   
  71.     </table>   
  72.   
  73.     </asp:View>   
  74.   
  75.       <asp:View ID="View3" runat="server">   
  76.   
  77.     <table>   
  78.   
  79.     <tr>   
  80.   
  81.     <td>   
  82.   
  83.     tab5   
  84.   
  85.     </td>   
  86.   
  87.     </tr>   
  88.   
  89.     </table>   
  90.   
  91.     </asp:View>   
  92.   
  93.     </asp:MultiView>   
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值