모범 사례 : ASP.NET의 CSS 또는 테마?

Question

언제 ASP.NET 테마를 사용해야하며 CSS는 사용해야합니까? 다른 하나를 사용하는 것의 장점이나 단점은 무엇입니까?

Answer 1

CSS over Themes를 사용하는 것이 좋습니다. 그 이유는 CSS에서 모든 브라우저에서 작동하도록 스타일을 수정할 수 있기 때문입니다. 테마로 동일한 작업을 수행 할 수 있지만 Microsoft의 디자이너는 모든 브라우저에서 작동하도록 수정 한 사항을 수정하여 악의적 인 작업을하는 것으로 유명합니다. CSS에 집착하면 시간을 낭비하지 않아도됩니다.

Answer 2

함께하면 더 좋습니다!

하지만 테마는 CSS의 대체가 아니며, CSS와 동일한 목적으로 제작되지 않았습니다. 응용 프로그램에 다른 테마를 정의하고 단일 행으로 테마를 변경하는 것이 목적입니다. 테마에는 CSS 파일, 이미지 파일 및 스킨이 포함될 수 있습니다.

스킨을 사용하면 복잡하고 완전한 솔루션을 포함하도록 asp.net 컨트롤의 스타일을 정의 할 수 있습니다. 예를 들어, 그리드 뷰를 정의하고 그 스타일과 속성을 정의 할 수 있습니다. 응용 프로그램 전체에서 정의 할 수 있습니다.

그래서 나는 그들이 함께 더 좋다고 생각하지만, 비교할만한 것은 아닙니다.

Answer 3

회원, 프로필 및 개인 설정을 사용하는 경우 테마가 정말 유용합니다. 그렇다면 Visual Studio Designer는 악명이 높습니다. 브라우저 호환성을 염두에두면 CSS를 광범위하게 사용해야합니다.

Answer 4

언급 한 바와 같이, 이들은 상호 배타적 인 것이 아닙니다. 나는 사이트 자체를 기반으로 적절한 CSS/미디어/스킨 파일을 자체적으로 포함하는 여러 테마를 가질 기회를 가졌습니다.

Answer 5

외부 디자인 에이전시 또는 디자이너를 고용하려는 경우 CSS가 잘 알려져 있기 때문에 CSS를 사용하면 훨씬 편리합니다. 테마는 훨씬 더 개발자/VS 중심이므로.

Answer 6

이들을 결합해야합니다. 귀하의 웹 사이트에있는 모든 html 요소의 일반적인 스타일링 (생성 된 모든 요소 포함)에 대한 테마 폴더의 CSS 파일을 사용하십시오.

컨트롤의 스킨 파일에서 기본 CSS 클래스를 설정할 수 있습니다. 요소의 레이아웃 및 기본 동작 (샘플 : 캘린더 컨트롤)과 같은 다른 속성도 여기에서 편집 할 수 있습니다.

스킨 파일은 css에서는 쉽게 수행 할 수없는 모든 레이아웃 관련 구성에 적합하지만 컨트롤의 .net 속성을 사용하면 좋습니다.

Answer 7

글쎄, 내가 함께 사용하는 것이 좋습니다, 나는 컨트롤에 CSS 클래스를 설정하고 CSS 파일에서 스타일을 테마를 사용합니다. 예 :

는

피부 :

는

<asp:CompareValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" /> 
<asp:RangeValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" /> 
<asp:CustomValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" /> 
<asp:RegularExpressionValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" /> 
<asp:RequiredFieldValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" /> 
<asp:ValidationSummary runat="server" CssClass="ValidationSummary" /> 

는 CSS는 :

.Validator 
{ 
    color: Red; 
} 

.ValidationSummary 
{ 
    font-size: 0.8em; 
} 

.ValidationSummary > ul 
{ 
    list-style-type: disc; 
    padding: 0 0 0 15px; 
    margin: 0; 
} 

.ValidationSummary > ul > li 
{ 
    padding: 0; 
    margin: 0; 
    color: Red; 
}