2013-07-12 2 views
1

HTML 메일을 디자인하고 테스트 한 이메일 클라이언트에서 최대한 멋지게 만들었습니다. 지금 Outlook.com을 확인하고 있는데 클라이언트에 대한 일부 조건부 스타일을 추가하려면 일부 마진이 필요하기 때문에 (아마도 여백을 지원하지 않기 때문에) 문제가 있습니다.outlook.com 특정 클래스에서 CSS를 대상으로 지정하는 방법

나는 Outlook.com은 .ExternalClass 클래스에 이메일을 감싸고 그래서 난 그냥 선택 텍스트의 색상을 변경할 것입니다 무슨 볼

* {color:black;} 
.ExternalClass * {color:red;} 
.ExternalClass .ecxMyClass {color:blue;} 
.ExternalClass .MyClass {color:green;} 

같은 시도 ecx 어떤 사용자 정의 클래스를 앞에 추가 것을 알고있다. 나는 그들 중 누구도 일할 수 없습니다. 또한 Firebug와 같은 검사기를 사용하여 내 스타일이 정의 된 곳을 찾을 수 없습니다.

http://www.campaignmonitor.com/css/에 따르면 Outlook.com은 머리글이나 본문에 스타일 태그를 지원해야하며 클래스를 선택기로 사용할 수 있어야합니다.

거의 모든 스타일이 인라인으로 정의되어 있지만 Outlook.com에서만 요소에 패딩을 추가하여 인라인으로 추가 할 수 없습니다. Outlook.com에서 내 맞춤 클래스 요소를 어떻게 타겟팅합니까?

답변

1

을 위해 작동 할 어떤 CSS 스타일에 대한 링크입니다. 둘 다 100 % 지원되며, 당신이 발견하기 시작하면, 특정 고객들을 위해 농구를 뛰어 넘으면 정말로 지저분해질 수 있습니다. 구독자가 다른 사람에게 전자 메일을 전달하는 경우 때때로 패딩이 제거 될 수 있으므로 nbsp의 빈 테이블 셀이 최상의 옵션입니다.

즉, 다른 클라이언트가 아닌 Outlook을 대상으로 지정하려는 경우 사용할 수있는 조건부 mso tags이 있습니다.

<!--[if gte mso 15]><!--> 
// This will only be seen by Outlook 2013 
<![endif]--> 
+0

조건부 주석은 outlook.com이 아닌 Outlook 전자 메일에서만 작동합니다. – josh1978

1

CSS는 Outlook 용 다른 볼 게임입니다. 전자 메일 코딩에 어려움을 겪었 기 때문에 심각한 제한이 있으며 뭔가 효과가 있다고 생각하는 것보다 기대를 축소하는 것이 좋습니다. 여기

내가 강하게 당신이 당신의 전자 우편에서 여백을 제거하는 것이 좋습니다 대신 패딩 또는 빈 (NBSP) 테이블 셀을 사용하십시오 다양한 전자 메일 클라이언트 http://www.campaignmonitor.com/css/

+0

감사하지만 이것은 내 질문에 대답하지 않습니다. 나는 outlook.com이 내가 설정하려고하는 CSS 속성을 지원하지만 CSS 선택기를 사용하여 대상을 지정하는 방법을 모르겠다는 것을 알고 있습니다. –

+0

@Devin 원래 질문에서 outlook.com에서 작동하지 않는 셀렉터를 사용하고있었습니다. 웹 사이트의 요점은 그 점을 보여주는 것이 었습니다. 모든 이메일 클라이언트에서 패딩을 보장하려면 CSS 속성 대신 수동으로 패딩을 만드는 것이 좋습니다. – AdamSchuld

0

Outlook.com 조건부 주석을 먹을 것이다, 위의 그래서 아무도 제대로 작동합니다 : 그것은 Outlook.com을 위해 작동하지만이 시도를 주면

확실하지.

this thread for details of an alternate approach을 참조하십시오.

관련 문제