Master Pages
Master Pages
are those pages that allows you to create a consistent look and behavior for
all the page in your web application. Master pages provides a template for
other pages with shared layout and functionality. Master pages cannot directly
accessed from the client side because it act as a template for other pages. In
master pages we can kept the content inside the ContentPlaceHolder or kept the
content outside ContentPlaceHolder. We can have multiple master pages in one
web application. The extension of Master Pages is ‘.master’. In simple words we
can say that master pages is an asp.net file with some predefined layout that
contains text, Graphics, HTML and server controls. The example of using master
page is given below where we have make a navigation bar using master pages.
For creating
navigation bar using master page then have to follow some steps :-
·
Create project then add web forms
master page item from the following.
· If you want to give style to your
navigation bar then give some styling by adding stylesheet item.
·
For giving localhost then you have
to add .aspx file.
The code for
site1.master page is :
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="navigation.Site1" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<link rel="stylesheet" href="StyleSheet1.css">
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div><nav class="navbar"><ul>
<li>Home</li>
<li>About</li>
<li>Courses</li>
<li>Our Placements</li>
<li>Contact Us</li>
</ul></nav></div>
<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
The code for stylesheet1.css page is :
.navbar {
margin: 0px;
padding: 0px;
color: white;
background-color: darkblue;
}
.navbar::before {
position: absolute;
height: 50%;
width: 100%;
z-index: -1;
opacity: 0.6;
}
ul {
display: flex;
list-style: none;
margin: 0px;
padding: 2px;
font-weight: bold;
}
li {
padding: 20px;
}
The code for .aspx Page is :
<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="navigation.WebForm3" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<h1></h1>
</asp:Content>
.png "master pages")
Advantages of Master Pages
1.They help us in to centralize the common functionality of our pages so it is easy to update.
2. Master pages provides an object model that helps in to customize it from the individual content pages.
3.
They give us the full control over the layout of the final page by allowing how
the placeholder controls are rendered.
4. Master pages are very easy to implement and provides consistent and standardized layout of the website.
5. It helps in to create one set of controls and code and apply the results to a set of pages.
6. The master pages provides functions that developers have created through traditional methods like duplicating existing code, text and control elements.
Comments
Post a Comment