Treeview with custom CSS [Resolved]

Posted by Patnaik.jyoti under ASP.NET on 1/6/2012 | Points: 10 | Views : 31555 | Status : [Member] | Replies : 1
Guys I need a treeview with custom css sample.




Responses

Posted by: Sksamantaray on: 1/6/2012 [Member] Silver | Points: 50

Up
0
Down

Resolved
Hi Try This

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">

<link href="../css/stylesheet.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.nodeLevel1
{
font:14px Arial,Sans-Serif;

border:double 1px gray;
background:red url(images/cyan.png) repeat-x top left;
height:25px;
width:100px;
padding-left:5px;
}
.nodeLevel2
{
font:12px Arial,Sans-Serif;

border:double 1px gray;
margin:0px;
padding-left:10px;
background:red url(images/gradient_orange.JPG) repeat-x top left;
height:25px;
width:100px;
}
.nodeLevel3
{
font:10px Arial,Sans-Serif;
border:double 1px gray;
margin:0px;
padding-left:15px;
background:red url(images/grayMenuBar.PNG) repeat-x top left;
height:25px;
width:100px;
}
</style>
<title>TreeView Level Styles</title>
</head>
<body>
<form id="form1" runat="server">
<div style=" float:left;width:10%;overflow:hidden;border:double gray 3px;
background:white url(images/divbackgroundR.png) repeat-x top left;
padding-top:40px;padding-bottom:10px;padding-left:10px;">


<asp:TreeView
id="TreeView1"
Runat="server" NodeIndent="10" ImageSet="Contacts" >
<ParentNodeStyle Font-Bold="True" ForeColor="#5555DD" />
<LevelStyles>
<asp:TreeNodeStyle CssClass="nodeLevel1" />
<asp:TreeNodeStyle CssClass="nodeLevel2" />
<asp:TreeNodeStyle CssClass="nodeLevel3" />
</LevelStyles>
<HoverNodeStyle Font-Underline="False" />
<SelectedNodeStyle Font-Underline="True" HorizontalPadding="0px"
VerticalPadding="0px" />
<Nodes>
<asp:TreeNode
Text="Home" SelectAction="Expand" >
<asp:TreeNode Text="Products" SelectAction="Expand" >
<asp:TreeNode Text="First Product" />
<asp:TreeNode Text="Second Product" />
</asp:TreeNode>
<asp:TreeNode Text="Services" SelectAction="Expand">
<asp:TreeNode Text="First Service" />
<asp:TreeNode Text="Second Service" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
<NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black"
HorizontalPadding="5px" NodeSpacing="0px" VerticalPadding="0px" />
</asp:TreeView>


</div>
</form>
</body>
</html>

Thanks,
Sanjay

Patnaik.jyoti, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response