.NET2.0 TreeView 改变样式

<%@ Page Language="C#" Theme="Default" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>TreeView Skins</title>
</head>
<script runat="server">
void Page_PreInit() {
TreeView1.SkinID = Request.Form["DropDownList1"];
}
</script>
<body>
<div>
<h2>TreeView Skins</h2>
<form action="treeview05_themes_cs.aspx" runat="server">
<asp:DropDownList ID="DropDownList1" AutoPostBack="true" runat="server">
<Items>
<asp:ListItem Value="Select a Skin to Apply: "/>
<asp:ListItem Value="--------------------------------- "/>
<asp:ListItem Value="Help"/>
<asp:ListItem Value="BulletedList"/>
<asp:ListItem Value="Arrows"/>
<asp:ListItem Value="Contacts"/>
<asp:ListItem Value="FAQ"/>
<asp:ListItem Value="MSDN"/>
<asp:ListItem Value="Inbox"/>
<asp:ListItem Value="Events"/>
<asp:ListItem Value="TOC"/>
</Items>
</asp:DropDownList>
<br /><br />
<asp:TreeView ID="TreeView1" SkinId="Help" runat="server">
<Nodes>
<asp:TreeNode Text="My Computer">
<asp:TreeNode Text="Favorites">
<asp:TreeNode Text="News"> 
<asp:TreeNode Text="MSN" NavigateUrl="http://www.msn.com"/>
<asp:TreeNode Text="MSNBC News" NavigateUrl="http://www.msnbc.msn.com"/>
</asp:TreeNode>
<asp:TreeNode Text="Technology"> 
<asp:TreeNode Text="Microsoft" NavigateUrl="http://www.microsoft.com"/>
<asp:TreeNode Text="ASP.NET" NavigateUrl="http://www.asp.net"/>
<asp:TreeNode Text="GotDotNet" NavigateUrl="http://www.gotdotnet.com"/>
<asp:TreeNode Text="MSDN" NavigateUrl="http://msdn.microsoft.com"/>
</asp:TreeNode>
<asp:TreeNode Text="Shopping"> 
<asp:TreeNode Text="MSN Shopping" NavigateUrl="http://shopping.msn.com"/>
<asp:TreeNode Text="MSN Autos" NavigateUrl="http://autos.msn.com"/>
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="City Links">
<asp:TreeNode Text="MapPoint" NavigateUrl="http://www.mappoint.com"/>
<asp:TreeNode Text="MSN City Guides" NavigateUrl="http://local.msn.com"/>
</asp:TreeNode>
<asp:TreeNode Text="Music Links">
<asp:TreeNode Text="MSN Music" NavigateUrl="http://music.msn.com"/>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</form>
</div>
</body>
</html>
 
样式

<asp:TreeView SkinId="Bookstore"
      NodeStyle-Font-Names="Verdana"
      NodeStyle-Font-Size="10pt"
      NodeStyle-ForeColor="Black"
      RootNodeStyle-Font-Bold="true"
      ParentNodeStyle-Font-Italic="true"
      ParentNodeStyle-Font-Underline="true"
      NodeIndent="10"
      runat="server"
  />

  <asp:TreeView SkinId="Simple"
      Font-Names="Verdana"
      ForeColor="Black"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#dd5555"
      SelectedNodeStyle-ForeColor="#dd5555"
      SelectedNodeStyle-Font-UnderLine="true"
      NoExpandImageUrl="images/bullets/square2.gif"
      ShowExpandCollapse="true"
      NodeIndent="10"
      Font-Size="8pt"
      runat="server"/>

  <asp:TreeView SkinId="Simple2"
      Font-Names="Tahoma"
      ForeColor="Black"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      NoExpandImageUrl="images/bullets/square3.gif"
      ShowExpandCollapse="true"
      NodeIndent="20"
      Font-Size="10pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList"
      ForeColor="Black"
      Font-Names="Verdana"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/bullet3.gif"
      ParentNodeStyle-ImageUrl="images/bullets/bullet3.gif"
      LeafNodeStyle-ImageUrl="images/bullets/bullet4.gif"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="8pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList2"
      ForeColor="Black"
      Font-Names="Verdana"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/square5.gif"
      ParentNodeStyle-ImageUrl="images/bullets/square5.gif"
      LeafNodeStyle-ImageUrl="images/bullets/square4.gif"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="8pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList3"
      ForeColor="Black"
      Font-Names="Verdana"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/clover3.gif"
      ParentNodeStyle-ImageUrl="images/bullets/clover3.gif"
      LeafNodeStyle-ImageUrl="images/bullets/clover4.gif"
      NodeStyle-HorizontalPadding="5"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="8pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList4"
      ForeColor="Black"
      Font-Names="Tahoma"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/bullet3.gif"
      ParentNodeStyle-ImageUrl="images/bullets/bullet3.gif"
      LeafNodeStyle-ImageUrl="images/bullets/bullet4.gif"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="10pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList5"
      ForeColor="Black"
      Font-Names="Tahoma"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/square5.gif"
      ParentNodeStyle-ImageUrl="images/bullets/square5.gif"
      LeafNodeStyle-ImageUrl="images/bullets/square4.gif"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="10pt"
      runat="server"/>

  <asp:TreeView SkinId="BulletedList6"
      ForeColor="Black"
      Font-Names="Tahoma"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      RootNodeStyle-ImageUrl="images/bullets/clover.gif"
      ParentNodeStyle-ImageUrl="images/bullets/clover3.gif"
      LeafNodeStyle-ImageUrl="images/bullets/clover4.gif"
      NodeStyle-HorizontalPadding="5"
      ShowExpandCollapse="false"
      ExpandDepth="100"
      NodeIndent="20"
      Font-Size="10pt"
      runat="server"/>

  <asp:TreeView SkinId="Arrows"
      ForeColor="Black"
      Font-Names="Verdana"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      ExpandImageUrl="images/bullets/right.gif"
      CollapseImageUrl="images/bullets/down.gif"
      NoExpandImageUrl="images/bullets/right2.gif"
      NodeStyle-HorizontalPadding="5"
      NodeIndent="20"
      Font-Size="8pt"
      runat="server"/>

  <asp:TreeView SkinId="Arrows2"
      ForeColor="Black"
      Font-Names="Tahoma"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      ExpandImageUrl="images/bullets/right.gif"
      CollapseImageUrl="images/bullets/down.gif"
      NoExpandImageUrl="images/bullets/right2.gif"
      NodeStyle-HorizontalPadding="5"
      NodeIndent="20"
      Font-Size="10pt"
      runat="server"/>

  <asp:TreeView SkinId="Help"
      NoExpandImageUrl="images/help/blank.gif"
      CollapseImageUrl="images/help/minus.gif"
      ExpandImageUrl="images/help/plus.gif"
      RootNodeStyle-ImageUrl="images/help/openbook.gif"
      ParentNodeStyle-ImageUrl="images/help/closedbook.gif"
      LeafNodeStyle-ImageUrl="images/help/topic.gif"
      NodeStyle-ForeColor="Black"
      NodeStyle-Font-Names="Tahoma"
      NodeStyle-Font-Size="8pt"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-ForeColor="Orange"
      SelectedNodeStyle-Font-Bold="true"
      runat="server"/>

  <asp:TreeView SkinId="HelpLines"
      ShowLines="true"
      LineImagesFolder="themes/default/images/lines"
      RootNodeStyle-ImageUrl="images/help/openbook.gif"
      ParentNodeStyle-ImageUrl="images/help/closedbook.gif"
      LeafNodeStyle-ImageUrl="images/help/topic.gif"
      NodeStyle-ForeColor="Black"
      NodeStyle-Font-Names="Tahoma"
      NodeStyle-Font-Size="8pt"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-ForeColor="Orange"
      SelectedNodeStyle-Font-Bold="true"
      runat="server"/>

    <asp:TreeView SkinId="Explorer"
      RootNodeStyle-ImageUrl="images/explorer/folder.gif"
      ParentNodeStyle-ImageUrl="images/explorer/folder.gif"
      LeafNodeStyle-ImageUrl="images/explorer/ie.gif"
      CollapseImageUrl="images/explorer/minus.gif"
      ExpandImageUrl="images/explorer/plus.gif"
      NoExpandImageUrl="images/explorer/blank.gif"
      NodeStyle-Font-Names="Arial"
      NodeStyle-Font-Size="8pt"
      NodeStyle-ForeColor="DarkBlue"
      NodeStyle-HorizontalPadding="5"
      RootNodeStyle-Font-Bold="true"
      SelectedNodeStyle-ForeColor="White"
      SelectedNodeStyle-BackColor="DarkBlue"
      HoverNodeStyle-Font-Underline="true"
      runat="server"
    />

    <asp:TreeView SkinId="ExplorerLines"
      ShowLines="true"
      LineImagesFolder="themes/default/images/lines"
      RootNodeStyle-ImageUrl="images/explorer/folder.gif"
      ParentNodeStyle-ImageUrl="images/explorer/folder.gif"
      LeafNodeStyle-ImageUrl="images/explorer/ie.gif"
      NodeStyle-Font-Names="Arial"
      NodeStyle-Font-Size="8pt"
      NodeStyle-ForeColor="DarkBlue"
      NodeStyle-HorizontalPadding="5"
      RootNodeStyle-Font-Bold="true"
      SelectedNodeStyle-ForeColor="White"
      SelectedNodeStyle-BackColor="DarkBlue"
      HoverNodeStyle-Font-Underline="true"
      runat="server"
    />

    <asp:TreeView SkinId="TOC"
      Font-Names="Verdana"
      ForeColor="Black"
      HoverNodeStyle-Font-Underline="true"
      HoverNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-ForeColor="#5555dd"
      SelectedNodeStyle-Font-UnderLine="true"
      ShowExpandCollapse="false"
      ExpandDepth="3"
      NodeIndent="10"
      Font-Size="8pt"
      runat="server">
      <LevelStyles>
          <asp:TreeNodeStyle ChildNodesPadding="5" Font-Bold Font-Size="10pt" ForeColor="DarkBlue" />
          <asp:TreeNodeStyle ChildNodesPadding="5" Font-UnderLine Font-Size="10pt" />
          <asp:TreeNodeStyle ChildNodesPadding="5" Font-UnderLine />
       </LevelStyles>
    </asp:TreeView>

    <asp:TreeView SkinId="MSDN"
      CollapseImageUrl="images/msdn/minus.gif"
      ExpandImageUrl="images/msdn/plus.gif"
      NoExpandImageUrl="images/msdn/dot.gif"
      NodeStyle-ForeColor="Black"
      NodeStyle-Font-Names="Verdana"
      NodeStyle-Font-Size="8pt"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-BackColor="#cccccc"
      HoverNodeStyle-BorderColor="#888888"
      HoverNodeStyle-BorderWidth="1"
      HoverNodeStyle-BorderStyle="Solid"
      SelectedNodeStyle-BackColor="White"
      SelectedNodeStyle-BorderColor="#888888"
      SelectedNodeStyle-BorderWidth="1"
      SelectedNodeStyle-BorderStyle="Solid"
      NodeIndent="10"
      runat="server"/>

  <asp:TreeView SkinId="News"
      Font-Names="Arial"
      ForeColor="Black"
      Font-Size="10pt"
      RootNodeStyle-ImageUrl="images/news/server.gif"
      ParentNodeStyle-ImageUrl="images/news/group.gif"
      LeafNodeStyle-ImageUrl="images/news/group.gif"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-Font-UnderLine="true"
      SelectedNodeStyle-Font-UnderLine="true"
      runat="server"
  />

  <asp:TreeView SkinId="Contacts"
      Font-Names="Verdana"
      ForeColor="Black"
      Font-Size="8pt"
      ExpandImageUrl="images/contacts/group.gif"
      CollapseImageUrl="images/contacts/group.gif"
      NoExpandImageUrl="images/contacts/online.gif"
      ParentNodeStyle-ForeColor="#5555dd"
      ParentNodeStyle-Font-Bold="true"
      NodeStyle-HorizontalPadding="5"
      SelectedNodeStyle-Font-UnderLine="true"
      runat="server"
  />

  <asp:TreeView SkinId="Inbox"
      Font-Names="Verdana"
      ForeColor="Black"
      Font-Size="8pt"
      RootNodeStyle-ImageUrl="images/outlook/inbox.gif"
      ParentNodeStyle-ImageUrl="images/outlook/folder.gif"
      LeafNodeStyle-ImageUrl="images/outlook/folder.gif"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-Font-UnderLine="true"
      SelectedNodeStyle-Font-UnderLine="true"
      runat="server"
  />

  <asp:TreeView SkinId="InboxLines"
      Font-Names="Verdana"
      ForeColor="Black"
      Font-Size="8pt"
      ShowLines="true"
      LineImagesFolder="themes/default/images/lines"
      RootNodeStyle-ImageUrl="images/outlook/inbox.gif"
      ParentNodeStyle-ImageUrl="images/outlook/folder.gif"
      LeafNodeStyle-ImageUrl="images/outlook/folder.gif"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-Font-UnderLine="true"
      SelectedNodeStyle-Font-UnderLine="true"
      runat="server"
  />

  <asp:TreeView SkinId="Events"
      RootNodeStyle-ImageUrl="images/events/log.gif"
      ParentNodeStyle-ImageUrl="images/events/log.gif"
      LeafNodeStyle-ImageUrl="images/events/warning.gif"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-ForeColor="Orange"
      SelectedNodeStyle-Font-Bold="true"
      SelectedNodeStyle-ForeColor="Orange"
      Font-Names="Verdana"
      ForeColor="Black"
      Font-Size="8pt"
      runat="server"
  />

  <asp:TreeView SkinId="FAQ"
      RootNodeStyle-ImageUrl="images/faq/topic.gif"
      ParentNodeStyle-ImageUrl="images/faq/topic.gif"
      LeafNodeStyle-ImageUrl="images/faq/question.gif"
      NodeStyle-HorizontalPadding="5"
      HoverNodeStyle-ForeColor="Purple"
      HoverNodeStyle-Font-UnderLine="true"
      SelectedNodeStyle-Font-Bold="true"
      Font-Names="Tahoma"
      ForeColor="DarkBlue"
      Font-Size="8pt"
      runat="server"
  />

 

你可能感兴趣的:(treeview)