您的位置:首页 > 编程语言 > ASP

关于ASP.NET AJAX中的TabContainer的样式

2010-06-12 15:17 711 查看
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TabDemo.aspx.cs" Inherits="TabDemo" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!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 runat="server">
<title>无标题页</title>
<style>

.ajax__tab_wf .ajax__tab_header
{
font-family: verdana,tahoma,helvetica;
font-size: 11px;
background-color:red;
}
.ajax__tab_wf .ajax__tab_outer
{
padding-right: 0px;
background-color:blue;
height: 21px;
}
.ajax__tab_wf .ajax__tab_inner
{
padding-left: 3px;

background-Image:url(Images/filled.gif);

}
.ajax__tab_wf .ajax__tab_tab
{
height: 13px;
padding: 4px;
margin: 0;
background-color:yello;
}
.ajax__tab_wf .ajax__tab_hover .ajax__tab_outer
{
background-color:black;
}
.ajax__tab_wf .ajax__tab_hover .ajax__tab_inner
{
background-color:lime;
}
.ajax__tab_wf .ajax__tab_hover .ajax__tab_tab
{
background-color:Olive;
}
.ajax__tab_wf .ajax__tab_active .ajax__tab_outer
{
background-color:Orange;}
.ajax__tab_wf .ajax__tab_active .ajax__tab_inner
{
background-color:Maroon;}
.ajax__tab_wf .ajax__tab_active .ajax__tab_tab
{
background-color:aqua;}
.ajax__tab_wf .ajax__tab_body
{
font-family: verdana,tahoma,helvetica;
font-size: 10pt;
border: 1px solid #999999;
border-top: 0;
padding: 8px;
background-color: #eeeeee;
}

</style>
</head>
<body>
<form id="form1" runat="server">
<div >
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<br />
<cc1:TabContainer ID="TabContainer1" CssClass="ajax__tab_wf" runat="server">
<cc1:TabPanel HeaderText="人事管理" ID="TabPanel1" runat="server">
<ContentTemplate>
<table>
<tr>
<td style="width: 100px; height: 21px">
用户名:</td>
<td style="width: 100px; height: 21px">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></td>
<td style="width: 100px; height: 21px">
</td>
</tr>
<tr>
<td style="width: 100px">
密码:</td>
<td style="width: 100px">
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></td>
<td style="width: 100px">
</td>
</tr>
<tr>
<td style="width: 100px">
<asp:Button ID="Button1" runat="server" Text="Button" /></td>
<td style="width: 100px">
</td>
<td style="width: 100px">
</td>
</tr>
</table>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel HeaderText="订单管理" ID="TabPanel2" runat="server">
</cc1:TabPanel>
<cc1:TabPanel HeaderText="日程管理" ID="TabPanel3" runat="server">
</cc1:TabPanel>
</cc1:TabContainer> <br />
<br />

</div>
</form>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: