Respect the author. Keep the words www.it55.com.
In this section, we contact Asp.net 2.0 for new features: Theme and skin.
Make theme and skin
Create a web site, right-click "add ASP. NET folder"> "topic" on the project, and rename "Topic 1" generated by default to "blue ":
Right-click "Add new project" on the blue topic ",
In the pop-up setting box, select "appearance file", name it "button. Skin", and click "add"
Modify button. Skin as follows:
<% --
Default appearance template. The following appearance is provided only as an example.
1. Name the control appearance. The definition of skinid must be unique because a control type cannot have duplicate skinid in the same topic.
<Asp: gridview runat = "server" skinid = "gridviewskin" backcolor = "white">
<Alternatingrowstyle backcolor = "blue"/>
</ASP: gridview>
2. Default appearance. Skinid is not defined. In the same topic, each control type can have only one default control appearance.
<Asp: Image runat = "server" imageurl = "~ /Images/image1.jpg "/>
-- %>
<Asp: button runat = "server" backcolor = "lightsteelblue" borderstyle = "NONE" forecolor = "Navy"/>
<Asp: button runat = "server" backcolor = "lightsteelblue" borderstyle = "Groove" forecolor = "Navy" text = "button" bordercolor = "royalblue" skinid = "withborder"/>
Click "add" on the right of the bluetheme to create a new project. In the displayed setting box, select the sample table, name it "“style.css", and click "add"
Style.css content is as follows:
Body {text-align: center; Background-color: Gray;
}
Default. aspx content:
<% @ Page Language = "C #" autoeventwireup = "true" theme = "blue" codefile = "default. aspx. cs" inherits = "_ default" %>
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> subject and skin </title>
</Head>
<Body>
<Form ID = "form1" runat = "server">
<Div>
The whole page is applied to style.css in the bluetopic, so the content is centered and the background is gray.
<Br/>
<Asp: button id = "button1" runat = "server" text = "button"/> <br/> if no skinid is set for this button, the default appearance is called.
<Br/>
<Br/>
<Asp: button id = "button2" runat = "server" text = "button" skinid = "withborder"/> <br/> This button calls a specific appearance Based on the skinid
</Div>
</Form>
</Body>
</Html>
Note: If the control on the page has its own style or appearance definition, the definition will overwrite the definition of the topic. Running result:
Theme Application
Theme = "theme name" is used in the page header to apply a topic at the page level. The application-level topic application method is as follows:
Configure the following section in the web. config file:
<Configuration>
<System. Web>
<Pages theme = "topic name"/>
</System. Web>
</Configuration>
Note: The theme settings in Web. config in a folder will overwrite the theme settings of the application.
Dynamic topic Loading
Because the theme attribute of the page object can only be set during or before the page's preinit event, we must modify the theme attribute value in the page_preinit event handler, to achieve the purpose of dynamically calling a topic.
The specific implementation method will not be described. You can refer to this article: Two implementation methods for dynamically loading themes in Asp.net 2.0
This is the only basic content for topics and styles. We will learn about the new features of Asp.net 2.0 in the next section.