페이지에서 CSS를 조건부로 렌더링하는 방법

쿠키를 기반으로 조건부로 CSS에서 CSS를 렌더링하고 싶습니다. 내 서버 측에서 쿠키를 감지하고 쿠키 값을 변수에 저장하고 aspx 페이지에서 코드 값을 변수로 저장하여 if else logic의 도움으로 CSS를 렌더링하려고합니다.페이지에서 CSS를 조건부로 렌더링하는 방법

내 .cs 코드 뒤에 나는 strCountryCookie="GB" 같은 쿠키 값을 저장하고 내 aspx 페이지에서 나는 변수 값에 저장된 쿠키 값을 기준으로 if else logic을 사용하여 CSS를 렌더링하려고합니다.

여기 내가 시도하는 방식입니다.

<% 
if(strCountryCookie=="DE") 
{ %> 
#acloginpod { 
    width:380px; 
    background:#ebebeb url(../images/acloginpodbg.gif) repeat-x; 
    border:1px solid #d3d3d3; 
    -webkit-border-radius:7px; 
    -moz-border-radius:7px; 
} 
<% } else { %>

오류가 표시됩니다. 그래서 다른 논리를 사용하여 쿠키 값을 기반으로 렌더링하는 방법을 알아낼 수 없습니다. 제발 컨셉으로 안내해주세요. 감사합니다

출처

2013-09-26 Thomas

실제 CSS에서는 if/else를 수행 할 수 없지만 'style = ""'inline css를 사용하면 if/else를 사용할 수 있습니다. – Albzi

CSS가 외부 조건을 결정할 수 없습니다. 의사 결정은 외부에 주입되어야합니다. – Farshid

다른 사람들이 말했듯이 같은 다른 클래스를 정의 당신은 CSS에서 서버 측 코드를 사용할 수 없습니다 당신이 문자열 뒤에 코드에서 액세스 할 수 있는지 확인하면 어떻게 당신이 한 것은 거의 정확 :. 당신의 문을 수정

protected string strCountryCookie = "GB";

<head runat="server"> 
    <title>Test</title> 
    <% if (strCountryCookie == "GB") 
     { %> 
     <style type="text/css"> 
     #acloginpod { 
       width:380px; 
       background:#ebebeb url(../images/acloginpodbg.gif) repeat-x; 
       border:1px solid #d3d3d3; 
       -webkit-border-radius:7px; 
       -moz-border-radius:7px; 
      } 
     </style> 
    <%} %>

이것은 다소 추해 보일지 모르겠지만 ... 특히 많은 국가를 추가하면 더욱 그렇습니다.

또 다른 옵션은 모든 사용자 지정 스타일을 자체 스타일 시트에 넣은 다음 쿠키를 기반으로 스타일 시트를 동적으로로드하는 것입니다.

<link id="_countryStyleSheet" rel="stylesheet" type="text/css" runat="server" />

을 그리고 뒤에 코드에서 스타일 시트를로드 : 당신은 스타일 시트의 이익이 경우 캐시되지 얻을

_countryStyleSheet.Href = String.Format("~/styles/{0}.css", strCountryCookie);

을이 예에서, 스타일 시트는 GB.css 이름을 지정해야합니다 등

출처

2013-09-26 13:18:11 MikeSmithDev

CSS 파일에는 코드를 사용할 수 없습니다.

귀하의 CSS를 별도의 파일에 넣은 다음 조건에 따라 헤더에 포함 시킬지 여부를 결정할 수 있습니다.

이러한 경우에 선호하는 접근 방식은 각 페이지에 모든 CSS 마크 업을 포함하는 것이지만 조건에 따라 다른 클래스로 내 요소를 할당하는 것입니다. id 대신 클래스 .acloginpod를 사용하고 country가 'DE'인 경우에만이 클래스로 요소를 할당한다는 의미입니다. 다음과 같은 당신이 다른 나라에 대해 서로 다른 스타일은 다음 요소 클래스를 정의하려면

가 나 : 는 ">

와 CSS의

는 mydiv-DE 또는 mydiv-GB

출처

2013-09-26 09:18:58 lot

페이지에서 CSS를 조건부로 렌더링하는 방법

답변

관련 문제