ASP.NET Master Page Example, How to use Master Page and Content Page in ASP.Net C# - Master Pages Tutorials

ASP.NET master pages allow you to create a consistent layout for the pages in your application. A single master page defines the look and feel and standard behavior that you want for all of the pages (or a group of pages) in your application. You can then create individual content pages that contain the content you want to display. When users request the content pages, they merge with the master page to produce output that combines the layout of the master page with the content from the content page.

=================
MasterPage.master
=================

<%@ Master Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ASP.NET Master Page Example, How to use Master Page and Content Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h1 style="color:Red">MyWebPage</h1>
        <hr />
        <table>
            <tr valign="top">
                <td>
                    <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
                    </asp:ContentPlaceHolder>
                </td>
                <td>
                    <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
                    </asp:ContentPlaceHolder>
                </td>
            </tr>
        </table>
        <hr />
        <div style="color:Gray">Page footer</div>
    </div>
    </form>
</body>
</html>


================
ContentPage.aspx
================

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" Title="" %>

<script runat="server">

</script>

<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
    <asp:Calendar
        ID="CalendarExample"
        runat="server"
        BackColor="Orange"
        BorderColor="DarkOrange"
        ForeColor="Snow"
        >
        <TitleStyle BackColor="DarkOrange" />
        <SelectedDayStyle BackColor="Crimson" />
    </asp:Calendar>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
    <asp:Image
        ID="Image1"
        runat="server"
        ImageUrl="~/Images/ExampleImage1.jpg"
        />
</asp:Content>


=================
ContentPage2.aspx
=================

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" Title="" %>

<script runat="server">

</script>

<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
    <asp:Calendar
        ID="CalendarExample"
        runat="server"
        BackColor="DodgerBlue"
        BorderColor="DarkBlue"
        ForeColor="Snow"
        >
        <TitleStyle BackColor="DarkBlue" />
        <SelectedDayStyle BackColor="LightBlue" ForeColor="DarkBlue" />
    </asp:Calendar>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
    <asp:Image
        ID="Image1"
        runat="server"
        ImageUrl="~/Images/ExampleImage2.jpg"
        Width="50%"
        Height="50%"
        />
</asp:Content>


Master Page isimportant part of any ASP.NET website. A master page allows the page developer to define a website template, indicating what portions of the template are to remain fixed across pages that use the template and what regions of the template are customizable on a page-by-page basis. Having the site design and layout centralized in one (or more) master pages makes it easy to add new pages to the site that inherit the same look and feel and greatly simplifies changing the site design or adding or removing content that is common to all pages, such as content in the <head> element, footers, and references to CSS and JavaScript files.

Tags: , ,
Hot on Web:


About author