Friday 6 July 2012

Create Menu In Asp.Net with help Css...................

Creating  Menu in Asp.Net with help CSS.....................




Take  Default.aspx  in Asp.Net and create menu ...........

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


 <!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> Cetpa Info Tech Pvt Lmd </title>


        <%--styleSheet.css  impliment in this page --%>



       <link href="StyleSheet.css" rel="stylesheet" type="text/css" />

</head>

<body>

       <form id="form1" runat="server">


       <div>

          

       </div>


       <div class="d1">

       <marquee behavior="alternate">Cetpa Info Tech Pvt Lmd</marquee>

       </div>


    <div>

    <ul>

    <li>Home</li>

    <li>About Us</li>

    <li>Contact Us</li>

    <li>Servies

    <ul>

    <li><a href="Defaultramesh.aspx" >Training</a></li>

    <li>Development</li>

    </ul>

     </li>

    <li>Gallary</li>

     </ul>

   </div>

   <div>



   <div class="d2">

           

   <asp:Login ID="Login1" runat="server" BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderPadding="4" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#333333">

<InstructionTextStyle Font-Italic="True" ForeColor="Black" />

<LoginButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284775" />

                   <TextBoxStyle Font-Size="0.8em" />

                   <TitleTextStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.9em"

                ForeColor="White" />

</asp:Login>

   

       </div>

      <div class="d3">

   

       </div>

   

       </div>

      </form>

</body>

</html>





/* Frist take StyleSheet.css for difine ....................................*/


body

{

   /*background-color:#CBE56F;*/

}

.d1

{

    width:auto;

    height:30px;

    color:Red;

   background-color:#1784D4;

   text-align:center;

   letter-spacing:1px;

 font-size:x-large;

 font-style:italic;

   padding-top:15px;

   font-weight:bold;

  padding-bottom:10px;

  

}

.d1:hover

{

    color:Green;

   background-color:Yellow;

   text-align:center;

   letter-spacing:15px;

}

h1

{

    color:Red;

   background-color:Aqua;

   text-align:center;

   letter-spacing:1px;

}

h1:hover

{

    color:Green;

   background-color:Yellow;

   text-align:center;

   letter-spacing:5px;

}

ul

{

    width:100%;

    list-style:none;

    margin:0px;

    padding:0px;

   

   

   

}

ul li

{

    width:19.75%;

    float:left;

    font-size:larger;

    font-style:italic;

    text-align:center;

    font-weight:bold;

    color:blue;

    margin:0px;

    padding-top:5px;

    height:30px;

    display:inline;

    text-decoration:none;

    background-color:Red;

    border:5px,Solid white,black;

    border-color: #000;

    border-width: 3px 3px 3px 0;

   border-style: solid;


   

   /*padding:2px 2px 2px 2px;

    margin-left:15px;

    margin:10px 23px 34px 67px;

    padding:10px 10px 10px 10px;*/

}

ul li:hover

{

 background-color:Black;

 color:Green;

 border:2px ,soli white;



   

}

   

   

   

ul li ul

{

    display:none;

}


ul li:hover ul

{

    display:block;

}



ul li ul li

{

    width:100%;

    text-align:center;

    top:10px;

    position:relative;

}


ul li ul li:hover

{

    background-color:Black;

    width:100%;

    text-align:center;

    top:10px;

    position:relative;

}


.d2

{

    width:22%;

    float:left;

    height:150px;

   

   

}

.d3

{ 
width:78%;

height:5%;



}

0 comments:

Post a Comment