2012-11-15 5 views
3

GWT를 사용하고 있습니다.GWT의 조건부 CSS

CSS는 다음 if/else 문을 사용할 수 있습니까?

.unseen-activity div.unseen-label { 
    display: inline; 

    if using chrome { left: 510px; } 
    else { left: 470px; } 

    margin: 0 auto; 
} 

내 GWT Java 코드가 브라우저를 확인한 다음 적절하게 스타일을 추가하는 것이 좋을까요?

주 - GWT에서 브라우저를 확인할 수 있는지 확실하지 않습니다. 케빈

+0

대신 브라우저에 따라 CSS를 변경해야하는 이유를 묻는 것이 좋습니다. 당신이 아주 희귀 한 일을하지 않으면, 그렇게해서는 안됩니다. – YardenST

+0

크롬은 내 CSS를 파이어 폭스와 다르게 렌더링하므로이 조건부 CSS가 필요했습니다. 그들은 다른 렌더러 (Web Kit 대 Gecko)를 사용합니다. –

답변

5

GWT의 CssResource 수행 할 수 있습니다

@if user.agent safari { 
    .unseen-activity div.unseen-label { 
     left: 510px; 
    } 
} 
@else { 
    .unseen-activity div.unseen-label { 
     left: 470px; 
    } 
} 

.unseen-activity div.unseen-label { 
    display: inline; 
    margin: 0 auto; 
} 

https://developers.google.com/web-toolkit/doc/latest/DevGuideClientBundle#Conditional_CSS

참고 항목 : safari 사용자 에이전트가 모든 webkits 일치; 다른 것이 필요한 경우 정적 방법을 @if 테스트로 사용하십시오.

+0

그게 효과가 있어요. 감사. –

+0

이 답변의 [최근 편집] (http://stackoverflow.com/revisions/13404821/2)을 읽으 셨습니다 :'@ if' /'@ else'는 필요하지는 않지만 오히려 여기에 무슨 일이 일어나는지 더 분명하게 보여줍니다 보다 암시적인 _override_에 의존하는 것보다. –

0

CSS

덕분에, 순수한 스타일 시트 언어 및 의사 결정 통합하기위한 옵션이 없습니다. GWT를 사용하거나 자바 스크립트를 사용할 때는 java에서 수행해야합니다.

+1

Thomas가 지적했듯이, 의사 결정 논리를 CSS에 추가 할 수 있기 때문에 필자는 Up-Vote를 철회했습니다. CSS가 아닌 –

+0

입니다. 이 파일은 서버 측에서 미리 처리하고 유효한 CSS 파일로 변환해야하는 파일입니다. –

+0

내 오래된 CSS를 잘못 말하면 좋지 않습니다. –