AjaxControlToolKit 4.0版本更新的最实用的工具就是TabContainer了
AjaxControlToolKit 使用方法
添加AjaxControlToolKit.DLL进工具箱
首先在页面中<%@ Register assembly="AjaxControlToolkit"
namespace="AjaxControlToolkit" tagprefix="ajax" %>
(从工具箱拖入AjaxControlToolKit控件的时候会自动引入)
然后引入一个<ajax:ToolkitScriptManager runat="server" ID="tm1"
></ajax:ToolkitScriptManager>
从工具箱拖入TabContainer,编辑成想要的样子,代码如下
<ajax:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0"
Height="800px" Width="500px" BorderStyle="Groove" BorderColor="#66FF66"
UseVerticalStripPlacement="false" >
<ajax:TabPanel runat="server" HeaderText="asdf" ID="TabPanel1" >
<ContentTemplate>
</ContentTemplate>
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel2" runat="server" HeaderText="科技"
CssClass="keji">
<ContentTemplate>
<table class="auto-style2">
<tr>
<td>id</td>
<td>categoryname</td>
<td>image</td>
<td>order_by</td>
<td>path</td>
</tr>
<asp:SqlDataSource
ID="SqlDataSource2" runat="server" ConnectionString="<%$
ConnectionStrings:eshopConnectionString %>" SelectCommand="SELECT * FROM
[product_category]"></asp:SqlDataSource>
<asp:Repeater ID="Repeater2"
runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<tr>
<td><%# Eval("Id") %></td>
<td><%# Eval("category_name") %></td>
<td><%# Eval("image") %></td>
<td><%# Eval("order_by") %></td>
<td><%# Eval("path") %></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
</ContentTemplate>
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel3" runat="server" HeaderText="探索">
<ContentTemplate>
<table class="auto-style2">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</ContentTemplate>
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel4" runat="server" HeaderText="体育"
Width="100px">
<ContentTemplate>
<table class="auto-style2">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</ContentTemplate>
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel5" runat="server" HeaderText="新闻">
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel6" runat="server" HeaderText="购物">
</ajax:TabPanel>
<ajax:TabPanel ID="TabPanel7" runat="server" HeaderText="篮球NBA">
</ajax:TabPanel>
</ajax:TabContainer>
使用中遇到一点问题,tab头的样式 不知道从哪里控制。。。
AjaxControlToolKit TabContainer 标题头的样式,布布扣,bubuko.com