C# ASP.net如何设计这个最好

在我的页面上，有时会有一个带有以下HTML的选项卡菜单：

<div class="tabWrapper">
    <div class="tab tabSelected"><a href="artworkHome.aspx">Home</a></div>
    <div class="tab"><a href="#">Create New</a></div>
    <div class="tab"><a href="#">Help!</a></div>
    <div class="clear"></div>
</div>

不同的页面组具有明显不同的选项卡。但是，如果每次都不使用HTML手动将这些选项卡写入页面，那么最好的方法是什么呢？这样，如果我想添加选项卡，就不必遍历每个页面，以确保它们都是相同的

我应该自己控制吗？以模块化方式加载这些选项卡的最佳方式是什么？我应该有一个包含所有选项卡组并构建HTML的类吗

---

谢谢你的帮助

您可以创建或使用。

如果它们是静态控件，最好在自定义ascx控件中创建Html并在页面上动态加载它们。一旦创建了它们，您应该考虑使用指令来加速页面呈现。

可能是一个用户控件，如：

public partial class TabControl : System.Web.UI.UserControl
{
    public List<TabObject> TabObjects { get; set; }

    public override void RenderControl(HtmlTextWriter writer)
    {
        writer.Write("<div class=\"tabWrapper\">");
        foreach (var item in TabObjects)
        {
            writer.Write("<div class=\"tab{0}\"><a href=\"{1}\">{2}</a></div>", (item.Selected) ? " tabSelected" : "", item.Link, item.Name);
        }
        writer.Write("<div class=\"clear\"></div>");
        writer.Write("</div>");

        base.RenderControl(writer);
    }
}

在您的页面中：

        UcTabControl.TabObjects = new List<TabObject>()
        {
            new TabObject(){
                Link = "artworkHome.aspx",
                Name = "Home",
                Selected = true
            },
            new TabObject(){
                Link = "#",
                Name = "Create New",
                Selected = false
            },
            new TabObject(){
                Link = "#",
                Name = "Help!",
                Selected = false
            },
        };

UcTabControl.TabObjects=new List（）
{
新TabObject（）{
Link=“artworkHome.aspx”，
Name=“Home”，
所选=真
},
新TabObject（）{
Link=“#”，
Name=“新建”，
所选=错误
},
新TabObject（）{
Link=“#”，
Name=“帮助！”，
所选=错误
},
};

输出将是：

<div class="tabWrapper">
     <div class="tab tabSelected"><a href="artworkHome.aspx">Home</a></div>
     <div class="tab"><a href="#">Create New</a></div>
     <div class="tab"><a href="#">Help!</a></div>
     <div class="clear"></div>
</div>

<div class="tabWrapper">
     <div class="tab tabSelected"><a href="artworkHome.aspx">Home</a></div>
     <div class="tab"><a href="#">Create New</a></div>
     <div class="tab"><a href="#">Help!</a></div>
     <div class="clear"></div>
</div>