Theme function in ASP. net2.0

Source: Internet
Author: User

The theme feature is added in ASP. NET 2.0, which makes it easier for websites to skin over.

Theme implementation includes: CSS, skin, and masterpage.

CSS is used to control the appearance of all HTML tags.

Skin is used to control the appearance of all ASP. NET servers, and its CSS style can be defined through the cssclass attribute.

Masterpage is a *. ASPX page template, but it is not defined in theme.

------------------------------------------------

· Example of creating theme:

1. Create the app_themes directory in the web project. It is a predefined directory. ASP. NET 2.0 automatically recognizes theme under its directory.

2. Create orangetheme and bluetheme subdirectories in the app_themes directory.

3. Add a skin file for each subdirectory under app_themes, such as control. Skin. ASP. NET 2.0 automatically analyzes each skin file. The name here only needs to be easily classified during development.

4. You can also add a CSS file for each subdirectory under app_themes. ASP. NET 2.0 automatically adds each CSS file to each page that uses this style.

· Define the page content and theme Style

1. The default. aspx page is defined as follows:

<% @ Page theme = "orangetheme" %>
<HTML>
<Head runat = "server">
<Title> orange page </title>
</Head>
<Body>
<Form ID = "form1" runat = "server">
Enter your name: <br/>
<Asp: textbox id = "txtname" runat = "server"/>
<Br/>
<Asp: button id = "btnsubmit" text = "submit name" runat = "server"/>
</Form>
</Body>
</Html>

2. The control. Skin file on the orangetheme homepage is defined as follows:

Note: Only appearance attributes can be specified, and attributes such as autopastback cannot be specified.

By default, unspecified skin defines the appearance for all textbox types.

<Asp: textbox backcolor = "orange" forecolor = "darkgreen" runat = "server"/>
<Asp: button backcolor = "orange" forecolor = "darkgreen" font-bold = "true" runat = "server"/>

Skinid can define the appearance of the specified textbox type.

<Asp: textbox skinid = "title" backcolor = "orange" forecolor = "darkgreen" runat = "server"/>

· Use theme on the page

1. Add the theme = "default" attribute to the top of the aspx file <% @ Page %>. In this way, you can use the default topic.

2. If you want to apply a theme to the entire website, you need to define it in Web. config.

<Configuration>
<System. Web>
<Pages theme = "orangetheme"/>
</System. Web>
</Configuration>

This definition is equivalent to a default theme in all website files. during use, you can still define theme for each page.
The skin part uses the theme defined in the page, and CSS will reload the CSS style sheet on the default homepage.

3. After theme is specified, all appearances are defined in skin. You can also specify the skinid of the control to define a separate appearance.

4. If you want to define theme programmatically, it must be processed in the page_preinit event, as shown below:

Void page_preinit (Object sender, eventargs E)
{
Page. theme = request ["themename"];
If you need to programmatically load the masterpage file for the page, you also need to define it here.
This. masterpagefile = request ["masterpagefile"];
}

Understanding these technologies will make the website more changeable.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.