VS2008(C#)制作网页Tab标签切换方法（四）——IFrame实现

利用HTML的iframe属性，并结合后台的CS代码实现，具体做法如下：



前台HTML代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main_Page.aspx.cs" Inherits="Tab_Tab_IFrame_Main_Page" %>

<!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>Main_Page</title>

<style type="text/css">

body

{

color: #000000;

background-color: #ffffff;

font-family: Tahoma, 宋体;

font-size: 12px;

margin: 0px;

padding: 0px;

text-align: center;

}

.aaa

{

background-color: #ffcc33;

}

.bbb

{

background-color: #99ffcc;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<div style=" margin-top: 20px;">

<asp:Button ID="Button1" runat="server" CssClass="aaa" Text="文学"

onclick="Button1_Click" />

<asp:Button ID="Button2" runat="server" CssClass="bbb" Text="科技"

onclick="Button2_Click" />

<asp:Button ID="Button3" runat="server" CssClass="bbb" Text="军事"

onclick="Button3_Click" />

<br />

<iframe id="IFrame" runat="Server" style=" border: solid 1px inherit; width: 300px; height: 500px;">

</iframe>

</div>

</form>

</body>

</html>



后台CS代码：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class Tab_Tab_IFrame_Main_Page : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

IFrame.Attributes.Add("src", "page1.aspx");

Button1.CssClass = "aaa";

Button2.CssClass = "bbb";

Button3.CssClass = "bbb";

}

protected void Button1_Click(object sender, EventArgs e)

{

IFrame.Attributes.Add("src", "page1.aspx");

Button1.CssClass = "aaa";

Button2.CssClass = "bbb";

Button3.CssClass = "bbb";

}

protected void Button2_Click(object sender, EventArgs e)

{

IFrame.Attributes.Add("src", "page2.aspx");

Button1.CssClass = "bbb";

Button2.CssClass = "aaa";

Button3.CssClass = "bbb";

}

protected void Button3_Click(object sender, EventArgs e)

{

IFrame.Attributes.Add("src", "page3.aspx");

Button1.CssClass = "bbb";

Button2.CssClass = "bbb";

Button3.CssClass = "aaa";

}

}



附加说明：

在同一目录下，新建三个ASPX网页，命名依次为: Page1.aspx、 Page1.aspx、 Page1.aspx




具体代码如上，源代码下载：



VS2008（C#）4种方法实现Tab标签灵活切换源码，测试成功！