ASP. NET implements topic switching instances

We usually see Web pages. Some software provides skin replacement functions and switches between topics. In ASP. NET 2.0, theme, skin, and CSS can be used to easily implement this function.

• First, we will briefly introduce three technologies: Theme technology, skin technology, and Cascading Style Sheet (CSS)

Theme and skin technologies allow developers or designers to customize webpage style settings and apply style support. Each topic can contain several Panel files, these Panel files determine the style applied when the control is to be output. developers can use the topic to determine the style to be used for different appearances.

Cascading Style Sheets (CSS) are used to design webpage styles and set the attributes of elements in webpages. Each topic can contain multiple CSS and skin files. The combination of the two settings constitutes a skin.

CSS mainly sets the attributes of webpage elements, controls the webpage appearance, webpage element location, appearance, and the ability to create special effects ..

Skin is mainly used to set some properties of controls used in webpages.

• How to Set theme in Visual Studio in ASP. NET 2.0

Add topic File

Upload the external View File (.skin.pdf file and Sample Table (.css file) in the new project)

Set the properties of the required control in the. Skin file. (Generally, you can set the control style as a template and use it as a skin.) the following uses the gridview as an example:

For convenience, we add a gridview control on the page and apply the format automatically. Open the source code to cut the control source code to the. Skin file. (Remove the Control ID. Note that if there are two identical controls on the webpage, set skinid. Generally, multiple types of clothes are prepared for each control ). Other controls perform the same operation.

Code display:

Use CSS styles to set element attribute code Display

• Here is a theme, a skin has been set up (you can set a variety of theme, so-called skin), how to apply the pre-configured skin to the webpage?

Set the theme attribute on the webpage, select the topic, and run the task. The operations are as follows:

• Here, the simple theme skin settings are basically complete, and we usually achieve skin replacement based on our preferences. Let's take a look at how we implement switching between theme:

The principle is very simple: you can use the button's Click Time to switch the webpage to achieve skin replacement, that is, the same webpage uses different themes, and the webpage address is switched to achieve this function.

The Code is as follows:

• Switching between topics is completed, but there are several points worth noting:

1. the control structure in each appearance file (the control type is consistent with the number of each control), especially the skinid control (the skinid must be the same ).

2. Try to keep the element structures in each style sheet file consistent.

3. You can set the enabletheming attribute of the control to determine whether to apply the settings of a control.