Tutorials » AspNet tutorials »

Analyze the default web page created by Visual Studio


In this chapter you will learn the various elements and HTML tags in the default web page created by the Visual Studio.


To view the contents of a file, double click on the file name in solution explorer. Open the default aspx file 'WebForm1.aspx' in HTML mode.



The contents of the default web page ('WebForm1.aspx') created by Visual Studio looks like this:


<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>WebForm1</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
</head>
<body MS_POSITIONING="GridLayout">

<form id="Form1" method="post" runat="server">

</form>

</body>
</html>


Let us analyze each line of the aspx file and try to understand some basic concepts. We will explain only the simple elements now and leave the complex portions for later study.


<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1"%>


The element Codebehind="WebForm1.aspx.vb" says that this file uses the vb file "WebForm1.aspx.vb". The next element Inherits="WebApplication1.WebForm1 says this aspx page is inherited from the class WebForm1 which is part of the namespace WebAppliaction1. (You can learn more about namespaces here.)

So, the above statement binds the 2 files together - WebForm1.aspx and WebForm1.aspx.vb. This is how VS.NET understands that these files are related and thus hide the .vb file in solution explorer.

WebForm1.aspx.vb is known as the 'Code behind File' for WebForm1.aspx. You will learn more about the code behind files in the next chapters.


<html>
<head>
<title>WebForm1</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
</head>
<body MS_POSITIONING="GridLayout">
</body>
</html>


You must be already familiar with the HTML tags <html>, <head>, <title>, <body> etc. They are mandatory tags for any html and aspx files. Withotu these tags, any web page is not a valid web page.

<title>WebForm1</title> represents the title of the web page when displayed in the browser. You can see this title in the top left corner of the web browser when this web page is displayed. If you like, you can change this title to anything yoiu want.

The following tags are called META TAGS. They are not displayed to the user. They are only for documentation purpose and for the attention of browsers and other search engines etc who will analyze and study the web pages in a different way. Even if you delete the below meta tags from your web page, nothing will happen.

<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">

You will learn more about META TAGS later.

The following tag is very important for any aspx page.

<form id="Form1" method="post" runat="server">

</form>

The <Form> tags are not mandatory for a web page, but is required for any aspx page if you like to use any of the web controls provided by ASP.NET. All the web controls must be places within the <Form> </Form> tags. It is reccommded you place all your html code within these tags.

Let us try a simple example:

Add some simple html to your Form tags as shown below.

<form id="Form1" method="post" runat="server">
<font size=5 color=red>hello World</font>
</form>

Now execute the web page. To compile and run any project in VS.NET, you can simply press Ctrl + F5. (Or, go to the menu 'Debug > Start without debugging.) This will compile your project and launch the web page in Internet Explorer.

Sometimes, VS.NET will complain that there is no 'Start Page'. In that case, you can right click on the file 'WebForm1.aspx' in the solution explorer and select 'Set as Start Page'.

When your web page is displayed in the browser, you will see the following:

Hello World

Now you can play around with this file by changing the HTML content. Try your html experience here and see how the page works.

In the above example, you used an aspx page, but didn't try any real aspx controls. You simply used some basic html tags in an aspx page. In the up coming chapters you will learn how to use the advanced asp.net controls to create rich html pages.



Next Chapter: Code Behind Files
Previous Chapter: Files created by default by VS.NET
More Chapters: ASP.NET Tutorials
More Tutorials: Tutorial Index



Top Contributors
TodayLast 7 Daysmore...

Awards & Gifts

Online Members

VELIDIRAVIRAM
More...
 
Copyright © SpiderWorks Technologies Pvt Ltd., Kochi, India