어쩌면 일부 친구들은 테마와 스킨에 대해 명확하지 않을 수도 있습니다. 먼저 테마와 스킨을 소개하겠습니다.
1. 소개:
테마와 스킨의 이름만 보면 어떤 용도로 사용되는지 알 수 있습니다. 이제 모두 알고 있는데 어떻게 사용하는지 이야기해 보겠습니다. 테마. 코드와 페이지 파일을 수정하지 않고도 페이지 스타일을 제어할 수 있습니다.
테마 파일은 App_Themes 폴더 아래에 별도로 배치되며 프로그램과 완전히 별개입니다.
2. 테마 및 스킨 사용 방법:
먼저 매우 간단한 예를 살펴보겠습니다.
App_Themesdefault1.skin 파일 코드:
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx: 파일 코드:
<%@ 페이지 언어="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="서버">
<title>예제 테마가 적용된 페이지</title>
</head>
<본문>
<form id="form1" runat="서버">
<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Hello 2" /><br />
</form>
</body>
</html>
default.aspx에 스타일을 제어하는 코드를 작성하지 않았음을 알 수 있지만 실행하면 레이블의 단어가 굵은 빨간색으로 표시되는 것을 볼 수 있습니다. 이것이 가장 기본적인 테마 예입니다.
앱_테마 폴더:
App_Themes 폴더는 프로그램의 루트 디렉터리에 있습니다. App_Themes는 테마 이름의 하위 폴더여야 합니다. 하위 폴더에는 여러 개의 .skin 및 .css 파일이 포함될 수 있습니다. 아래 그림에서는 default와 default2라는 두 개의 테마가 생성되었습니다.
테마 사용
1. 페이지에 테마를 적용합니다.
특정 페이지에 테마를 적용하려면 aspx 파일에서 <%@ Page Theme="..." %>를 직접 수정하세요. 예를 들어 이 페이지에 default2 테마를 적용하려면 <%를 설정하세요. @ Page Theme="default2" %> OK
2. 모든 페이지에 동일한 테마를 적용합니다.
모든 페이지에서 동일한 테마를 사용하려면 web.config의 <system.web> 노드 아래에 <pages theme="..."/> 문장을 추가합니다
. 3. 컨트롤이 테마를 적용하지 않도록 합니다.
첫 번째 예에서는 두 레이블의 스타일이 변경된 것을 확인했습니다. 이는 .skin 파일의 스타일이 페이지의 모든 레이블에 적용되었음을 의미합니다. 그러나 때로는 특정 Label이 .skin의 스타일을 적용하지 않기를 원할 때도 있습니다. 이 경우 Label의 EnableTheming 속성을 false로 설정하기만 하면 됩니다.
다른 레이블이 다른 스타일을 표시하도록 할 수도 있습니다. 아래 예를 참조하세요.
App_Themesdefault1.skin
<asp:label runat="server" 글꼴-bold="true" forecolor="Red" />
<asp:label runat="server" SkinID="Blue"font-bold="true" forecolor="blue" />
deafult.aspx
<%@ 페이지 언어="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="서버">
<title>예제 테마가 적용된 페이지</title>
</head>
<본문>
<form id="form1" runat="서버">
<asp:Label ID="Label2" runat="server" Text="Hello 2" SkinID="Blue" /><br />
<asp:Label ID="Label3" runat="server" Text="Hello 3" /><br />
</form>
</body>
</html>
실행한 후에는 두 레이블의 표시 스타일이 다르다는 것을 알 수 있습니다.
4. 기타 방법:
앞에서 언급했듯이 aspx 파일 헤더에 <%@ Page Theme="..." %> 를 사용하여 테마를 사용하고, 이 방법을 사용하여 테마에 스타일을 적용하면 aspx에서 작성한 컨트롤 속성 스타일을 덮어쓰게 됩니다. 예를 들어:
App_Themesdefault1.skin
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx
<%@ 페이지 언어="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="서버">
</head>
<본문>
<form id="form1" runat="서버">
<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Hello 2" ForeColor="blue" />
</form>
</body>
</html>
작업 결과 모든 레이블의 전경색은 빨간색입니다.
테마를 적용하기 위해 <%@ Page StyleSheetTheme="..." %>를 사용하면 aspx 파일에 작성한 스타일 속성을 덮어쓰지 않습니다.
컨트롤이 스타일 속성을 적용하는 순서는 다음과 같습니다.
a. StyleSheetTheme에서 참조하는 스타일
b. 코드로 설정된 컨트롤 속성(StyleSheetTheme 재정의)
c. 테마(처음 2개 포함)에서 참조하는 스타일
에는 CSS가 포함되어 있습니다.
.css 파일을 테마 디렉토리에 넣으면 해당 테마를 사용하는 페이지에 .css가 자동으로 적용됩니다.
3. 배경 코드를 사용하면 웹사이트의 스킨을 쉽게 변경할 수 있습니다. .
위에서 언급한 것은 aspx 파일이나 web.config에서 테마를 적용하는 방법인데, 블로그와 같이 사용자마다 스킨이 다른 웹사이트에서 스킨을 변경하기 위해 위의 방법을 사용하는 것은 당연히 불편합니다.
다음은 위의 상황을 해결하기 위해 백그라운드 코드에서 테마를 동적으로 참조하는 방법을 소개합니다. 테마는 페이지가 요청될 때 가장 먼저 적용되어야 하므로 Page_PreInit 이벤트에 코드를 작성해야 합니다. , 딱 한 문장만요:
페이지.테마 = "...";
여기에서는 각 사용자가 서로 다른 스킨을 가지고 있다는 것을 쉽게 인식하기 위해 데이터베이스에서 각 사용자가 설정한 서로 다른 테마 이름을 읽으면 됩니다.
-----------------------------
위 내용은 모두 개인적인 의견과 경험이므로 잘못된 점이 있으면 조언 부탁드립니다.