How to add a CSS style sheet reference to all Web forms in a Visual C# .NET Web project (320985)


The information in this article applies to:

  • Microsoft ASP.NET (included with the .NET Framework) 1.0
  • Microsoft Visual C# .NET (2002)
  • Microsoft Visual Studio .NET (2002), Professional Edition
  • Microsoft Visual Studio .NET (2002), Enterprise Architect Edition
  • Microsoft Visual Studio .NET (2002), Enterprise Developer Edition
  • Microsoft Visual Studio .NET (2002), Academic Edition
  • Microsoft ASP.NET (included with the .NET Framework 1.1)
  • Microsoft Visual C# .NET (2003)
  • Microsoft Visual Studio .NET (2003), Professional Edition
  • Microsoft Visual Studio .NET (2003), Enterprise Architect Edition
  • Microsoft Visual Studio .NET (2003), Enterprise Developer Edition
  • Microsoft Visual Studio .NET (2003), Academic Edition
This article was previously published under Q320985
For a Microsoft Visual Basic .NET version of this article, see 323843.

IN THIS TASK

SUMMARY

This step-by-step article describes how to create a custom Web Form template so that you can include a cascading style sheet (CSS) reference in all Web Forms in a Visual C# .NET Web project.

Typically, Web site designers must maintain a consistent look-and-feel on every page for a particular Web site. This article describes how to create a custom Web Form template that contains a link to a CSS style sheet. When you create all Web Forms in an application with this template, you provide an easy way to maintain a consistent design across the site.

The technique that is described in this article is based on the concept of Microsoft Visual Studio .NET Enterprise Templates. For more information, see the "REFERENCES" section of this article.

back to the top

Edit WebProjectItems.vsdir file

  1. In Notepad, open the WebProjectItems.vsdir file from the following folder:
    In Visual Studio .NET 2002:

    C:\Program Files\Microsoft Visual Studio .NET\VC#\CSharpProjectItems\WebProjectItems


    In Visual Studio .NET 2003:

    C:\Program Files\Microsoft Visual Studio .NET 2003\VC#\CSharpProjectItems\WebProjectItems

  2. Add the following text to the end of the file:
    ..\MyCustomWebFormWiz.vsz|{FAE04EC1-301F-11d3-BF4B-00C04F79EFBC}|My Custom
Form|10|#2263|{FAE04EC1-301F-11d3-BF4B-00C04F79EFBC}|4534|0|WebForm.aspx
  3. Save the file.
back to the top

Create custom Web form wizard

  1. Open the following folder:
    In Visual Studio .NET 2002:

    C:\Program Files\Microsoft Visual Studio .NET\VC#\CSharpProjectItems


    In Visual Studio .NET 2003:

    C:\Program Files\Microsoft Visual Studio .NET 2003\VC#\CSharpProjectItems

  2. Copy the CSharpAddWebFormWiz.vsz file to the MyCustomWebFormWiz.vsz file.
  3. In Notepad, open the MyCustomWebFormWiz.vsz file, and then change the Param value as follows:
    Param="WIZARD_NAME = MyCustomWebFormWiz"
  4. Save the file.
back to the top

Create custom Web form template

  1. Open the following folder:
    In Visual Studio .NET 2002:

    C:\Program Files\Microsoft Visual Studio .NET\VC#\VC#Wizards


    In Visual Studio .NET 2003:

    C:\Program Files\Microsoft Visual Studio .NET 2003\VC#\VC#Wizards

  2. Copy CSharpAddWebFormWiz to a new directory that is named MyCustomWebFormWiz.
  3. Open the following folder:
    In Visual Studio .NET 2002:

    C:\Program Files\Microsoft Visual Studio .NET\VC#\VC#Wizards\MyCustomWebFormWiz\Templates\1033


    In Visual Studio .NET 2003:

    C:\Program Files\Microsoft Visual Studio .NET 2003\VC#\VC#Wizards\MyCustomWebFormWiz\Templates\1033

  4. In Notepad, open the WebForm1.aspx file, and then add the following link reference (which appears indented) between the <meta name=vs_targetSchema> tag and the closing <head> tag as follows:
    <meta name=vs_targetSchema content="[!output DEFAULT_TARGET_SCHEMA]">
    <link id="link1" rel="stylesheet" href="myStyleSheet.css" type="text/css" runat="server" />
</head>
  5. Save the file.
back to the top

Test link reference

  1. Start Microsoft Visual Studio .NET.
  2. On the File menu, point to New, and then click Project.
  3. Click Visual C# Projects under Project Types, and then click ASP.NET Web Application under Templates.
  4. On the Project menu, click Add New Item to add a style sheet to the project, and then name the style sheet myStyleSheet.css.
  5. Set the background color of the body element to blue for testing purposes.
  6. On the Project menu, click Add New Item.
  7. Click My Custom Form under Templates, name the file, and then click Open to add a custom Web Form to the application. Notice that the style sheet is applied automatically to the new Web Form and that the background is blue.
back to the top

REFERENCES

For more information about Visual Studio .NET Enterprise Templates, visit the following Microsoft Web site:

Enterprise Templates for Distributed Applications
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/vsent7/html/vxoriEnterpriseTemplates.asp

back to the top
Modification Type:MajorLast Reviewed:10/17/2005
Keywords:kbHOWTOmaster kbIDEProject kbWebForms KB320985 kbAudDeveloper
©2004 Microsoft Corporation. All rights reserved.