AjaxControlToolKit TabContainer 标题头的样式

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>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                     </table>                 </ContentTemplate>

            </ajax:TabPanel>             <ajax:TabPanel ID="TabPanel4" runat="server" HeaderText="体育" Width="100px">                 <ContentTemplate>                     <table class="auto-style2">                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                         </tr>                         <tr>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</td>                             <td>&nbsp;</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头的样式 不知道从哪里控制。。。

posted @ 2014-04-30 09:47  x_window  阅读(357)  评论(0编辑  收藏  举报