Horizontal CSS MENU


asp.net css horizontal menu

Hello Friends,
In these Tutorials we see How to Build "Horizontal CSS Menu" for Asp.net.

CSS Code :

<style type="text/css">
     #menu_hr
     {
         background:#141414;
         width:100%;
     }
     #menu_hr ul
     {
         width:auto;
         padding:10px;
     }
     #menu_hr ul li
     {
         list-style-type:none;
         display:inline;
         padding-right:5px;
     }
     #menu_hr ul li a
     {
         background:#6699cc;
         padding:7px 15px 7px 15px;
         text-decoration:none;
         color:#ffffff;        
     }
     #menu_hr ul li a:hover
     {
         background:#006699;
         padding:7px 15px 7px 15px;
         text-decoration:none;
         color:#ffffff;         
         
     }
    </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 "Horizontal CSS MENU"

Back To Top