Use asp.net 2.0 themes and skins to achieve web site beautification

Source: Internet
Author: User
Tags object model root directory advantage

Themes and skins are new in ASP.net 2.0, and using the theme and appearance feature of ASP.net 2.0, you can break styles and layout information into separate filegroups, collectively, "Themes." The theme can then be applied to any site, affecting the appearance of pages and controls in the site. This way, you can easily maintain style changes to your site by changing the theme without having to edit the pages of the site. You can also share topics with other developers. Application of asp.net 2.0 "theme and Appearance" features easy to achieve the site beautiful control.

ASP.net provides features that you can customize the appearance or style of pages and controls in your application. Control supports the Style object model, which is used to set style properties such as font, border, background color, foreground color, width, height, and so on. Control also fully supports cascading style sheets (CSS) that can separate style settings from control properties. You can define the style information as a control property or a CSS, or you can define this information in a separate filegroup named Theme to apply to all or part of the application's pages. Each control style is specified as Skin in the theme.

Theme, which provides an easy way to define style settings for controls and pages in your site, independent of the application's pages. The advantage of multiple topics is that you can design your site regardless of the style, and you do not need to update the page or application code later when you apply the style. In addition, you can obtain custom themes from external sources to apply style settings to your application. The advantage of a theme is that the style settings are stored in a single location and can be maintained independently of the application that applies the theme.

The following example shows a page that has the same theme, which is used to specify control style settings. Note that the page itself does not need to contain any style information. At run time, the theme automatically applies style attributes to controls on the page.

Create a new Web project, click "Add New Item", select "Theme Appearance" and name "Button.skin", and click "Add" button, as shown in Figure 1

Figure 1

When you click the Add button, the following dialog box pops up. 2 Ask if you want to add a theme file to the "App_Themes" folder, in which the subject file must be stored under the App_Themes folder in the root directory, and the theme is made up of named subdirectories under this folder. The subdirectory contains one or more collections of skin files with the. skin extension. A theme can also contain a subdirectory of a static file such as a CSS file and/or an image. We click Yes to add a theme named "button" to the Web. As shown in Figure 3

Figure 2

Figure 3

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.