Peut-être que certains amis ne sont pas très clairs sur les thèmes et les skins. Commençons par présenter les thèmes et les skins.
1. Introduction :
Il suffit de regarder les noms Thèmes et Skins et vous saurez à quoi ils servent. Parlons maintenant de ce à quoi ils servent (comment pouvez-vous encore dire, ~_~) quand vous les connaissez tous ? Thèmes. Contrôlez et styles de page sans modifier notre code et nos fichiers de page.
Les fichiers Thèmes sont placés séparément dans un dossier App_Themes et sont complètement distincts de votre programme.
2. Comment utiliser les thèmes et les skins :
Regardons d'abord un exemple très simple :
Code du fichier App_Themesdefault1.skin :
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx : code de fichier :
<%@ Page Language="C#" Theme="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 id="Head1" runat="serveur">
<title>Page avec exemple de thème appliqué</title>
</tête>
<corps>
<form id="form1" runat="serveur">
<asp:Label ID="Label1" runat="server" Text="Bonjour 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Bonjour 2" /><br />
</form>
</corps>
</html>
Vous pouvez voir que nous n'avons écrit aucun code pour contrôler le style dans default.aspx, mais lorsque nous l'exécutons, nous constatons que les mots sur l'étiquette sont devenus en gras et en rouge. Il s'agit de l'exemple de thème le plus basique.
Dossier App_Themes :
Le dossier App_Themes se trouve dans le répertoire racine du programme. App_Themes doit être un sous-dossier du nom du thème. Le sous-dossier peut contenir plusieurs fichiers .skin et .css. Dans la figure ci-dessous, deux thèmes sont créés, nommés default et default2 :
Utiliser des thèmes
1. Appliquer le thème à une page :
Si vous souhaitez appliquer un thème à une certaine page, modifiez <%@ Page Theme="..." %> directement dans le fichier aspx. Par exemple, si vous souhaitez appliquer le thème par défaut2 à cette page, définissez <%. @ Page Theme="default2" %> OK
2. Appliquez le même thème à toutes les pages :
Si vous souhaitez utiliser le même thème sur toutes les pages, ajoutez la phrase <pages theme="..."/> sous le nœud <system.web> dans web.config
3. Laissez le contrôle ne pas appliquer le thème :
Dans le premier exemple, nous avons vu que les styles de deux Labels ont changé, ce qui signifie que le style du fichier .skin a pris effet sur tous les Labels de la page. Mais parfois, nous souhaitons qu'un certain Label n'applique pas le style dans .skin. Dans ce cas, il vous suffit de définir la propriété EnableTheming du Label sur false.
Peut-être souhaitez-vous également que différentes étiquettes affichent des styles différents. Il vous suffit de définir l'attribut SkinID de l'étiquette. Voir l'exemple ci-dessous :
App_Themesdefault1.skin
<asp:label runat="server" font-bold="true" forecolor="Red" />
<asp:label runat="server" SkinID="Blue" font-bold="true" forecolor="blue" />
deafult.aspx
<%@ Page Language="C#" Theme="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 id="Head1" runat="serveur">
<title>Page avec exemple de thème appliqué</title>
</tête>
<corps>
<form id="form1" runat="serveur">
<asp:Label ID="Label2" runat="server" Text="Bonjour 2" SkinID="Blue" /><br />
<asp:Label ID="Label3" runat="server" Text="Bonjour 3" /><br />
</form>
</corps>
</html>
Après l'exécution, vous constaterez que les styles d'affichage des deux étiquettes sont différents.
4. Autres méthodes :
Comme mentionné précédemment, l'utilisation de <%@ Page Theme="..." %> dans l'en-tête du fichier aspx pour utiliser le thème et l'utilisation de cette méthode pour appliquer le style dans le thème écraseront le style d'attribut de contrôle que vous avez écrit en aspx. Par exemple:
App_Themesdefault1.skin
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx
<%@ Page Language="C#" Theme="default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http https://www.w3.org/1999/xhtml ">
<head id="Head1" runat="serveur">
</tête>
<corps>
<form id="form1" runat="serveur">
<asp:Label ID="Label1" runat="server" Text="Bonjour 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Bonjour 2" ForeColor="blue" />
</form>
</corps>
</html>
À la suite de l’opération, la couleur de toutes les étiquettes est rouge.
L'utilisation de <%@ Page StyleSheetTheme="..." %> pour appliquer un thème n'écrasera pas l'attribut de style que vous avez écrit dans le fichier aspx :
l'ordre dans lequel le contrôle applique l'attribut de style est le suivant :
a. Style référencé par StyleSheetTheme
b. Propriétés du contrôle définies par le code (remplacer StyleSheetTheme)
c. Le style référencé par Theme (couvrant les 2 premiers)
contient du CSS :
Les fichiers .css peuvent également être utilisés dans les thèmes. Lorsque vous placez le fichier .css dans un répertoire de thème, votre .css sera automatiquement appliqué à la page qui utilise ce thème.
3. Le code d'arrière-plan peut facilement changer l'apparence du site Web. .
Ce que j'ai mentionné ci-dessus est d'appliquer des thèmes dans des fichiers aspx ou web.config. Cependant, il n'est évidemment pas pratique d'utiliser la méthode ci-dessus pour changer de skin dans un site Web comme un blog où chaque utilisateur a un skin différent.
Ce qui suit explique comment référencer dynamiquement le thème dans le code d'arrière-plan pour résoudre la situation ci-dessus. Le thème doit être appliqué le plus tôt possible lorsque la page est demandée, nous devons donc écrire du code dans l'événement Page_PreInit. , juste une phrase :
Page.Theme = "...";
Ici, il suffit de lire les différents noms de thèmes définis par chaque utilisateur à partir de la base de données pour se rendre facilement compte que chaque utilisateur a un skin différent.
------------------------------------------
Ce qui précède sont toutes des opinions et expériences personnelles. S'il y a quelque chose qui ne va pas, donnez-moi vos conseils, merci !