Vertical CSS Menu for ASP.NET


Vertical CSS Menu

Hello Friends,
In these Tutorials we see "How to Create Vertical CSS Menu Bar"

CSS Code :

<style type="text/css">
     #menu_hr
     {
         background:#141414;
         width:300px;
         height:250px;
     }
     #menu_hr ul
     {         
         padding:10px;
         display:block;         
     }
     #menu_hr ul li
     {
         list-style-type:none;
         padding-right:5px;
         width:250px;
     }
     #menu_hr ul li a
     {
         background:#6699cc;
         padding:7px 15px 7px 15px;
         text-decoration:none;
         color:#ffffff;   
         width:250px;
         display:block;
     }
     #menu_hr ul li a:hover
     {
         background:#006699;
         padding:7px 15px 7px 15px;
         text-decoration:none;
         color:#ffffff;         
         width:250px;
         display:block;
     }
    </style>

Create HTML Page :

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

<!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>
    

 ----- ADD CSS Code ----


</head>
<body>
    <form id="form1" runat="server">
    <div>
     <div id="menu_hr">
      <ul>
       <li><a href="#">Home</a></li>
       <li><a href="#">About</a></li>
       <li><a href="#">Profile</a></li>
       <li><a href="#">Noftification</a></li>
       <li><a href="#">Contact US</a></li>
      </ul>
     </div>
    </div>
    </form>
</body>
</html>

Tag : ASP.NET, HTML5
0 Komentar untuk "Vertical CSS Menu for ASP.NET"

Back To Top