CSS를 사용하여 HTML 전자 메일을 작성하는 방법은 무엇입니까?

일반적으로 html 페이지를 작성하는 것처럼 html 전자 메일을 작성할 수 있습니까?
전자 메일 본문을 모든 HTML 코드 문자열로 설정하려고합니다.

이메일 본문 오프 캐어는 복잡 할 것이므로 한 페이지 HTML 이메일을 작성하기 위해 많은 CSS를 사용해야합니다.

어떻게해야합니까?
어디에서 CSS 코드를 저장 하시겠습니까?
내 서버의 외부 .css 파일을 포함 할 수 있습니까?CSS를 사용하여 HTML 전자 메일을 작성하는 방법은 무엇입니까?

출처

2011-03-28 Almas Adilbek

html에 css를 포함 할 수 있습니다. –

말은, 전체 이메일 html 본문이있는 스타일 태그의 echo css 문자열입니다. –

비록 내가 웹 페이지에 대해 권하는 것이 아니라 완전히 뒤에서 들릴지라도, 이메일에 CSS를 사용하는 가장 좋은 방법은 style 속성의 모든 인라인입니다. 그 이유는 많은 전자 메일 응용 프로그램과 특히 gmail, yahoo, hotmail 등과 같은 웹 메일은 사용자의 css 클래스 선언을 존중하지 않으며 인라인이 아니라면 종종 모든 CSS를 제거합니다. 많은 시간이 <head> 전체가 제거되고 매우 자주 <body> 태그가 이메일에 포함되면 제거됩니다.

HTML 전자 메일을 만들기 시작한 경우 Litmus를 사용하거나 다양한 전자 메일 클라이언트에서 수동 테스트를하는 것이 좋습니다. Litmus 또는 다른 유사한 서비스는 당신에게 많은 시간을 절약 할 것입니다.

출처

2011-03-28 05:33:44

그런데 Litmus는 무료가 아닙니다. 리트머스 서비스로 이메일을 무료로 테스트 할 수 있습니까? –

그래, 나는 그것이 자유롭지 않다는 것을 안다. 나는 자유로운 Litmus와 비교 될 수있는 어떤 것도 알지 못한다. 당신은 확실히 그것을 사용하지 않아도되지만 실제로 시간을 절약 할 수 있습니다. 그렇지 않으면 좋은 의견을 얻기 위해 Gmail, Hotmail 및 Outlook에서 이메일을 확인하는 것이 좋습니다. –

외인용 CSS 파일을 포함 할 수 있지만 네트워크에 연결된 경우 CSS 인라인을 포함하는 것이 효과적입니다.

출처

2011-03-28 05:22:27

HTML 메일을 보내려면 Content-Type 헤더를 text/html로 설정하십시오.

CSS 스타일을 HTML에 직접 인라이닝하는 것이 좋습니다. 또는 단순히 스타일을 필요로하는 요소에 "스타일"속성을 사용하십시오. 보안상의 이유로 대부분의 메일 클라이언트는 기본적으로 외부 이미지 및 스타일을 렌더링하지 않습니다. 메일에 이미지를 첨부 할 수 있다는 것을 알고 있습니다 (또는 원격 서버에 이미지를 첨부하도록 선택할 수 있지만 메일 앱은 사용자에게 다운로드하라는 메시지가 표시됩니다). .css 파일을 첨부 파일로 가질 수 있습니다.

HTML 메일을 보내는 대부분의 클라이언트는 multipart/alternative MIME 형식도 사용합니다. HTML이 아닌 클라이언트는 메일을 일반 텍스트로 렌더링 할 수 있습니다. 일반적으로 http://www.campaignmonitor.com/css/

후 : 여기

이

Return-Path: <[email protected]> 
Received: from selbiepc (11-11-111-11.foob.ga.baloneynet.net [11.11.111.11]) 
     by mx.foobar.com with ESMTPS id f2sm4177017ybh.22.2011.03.27.22.24.02 
     (version=SSLv3 cipher=OTHER); 
     Sun, 27 Mar 2011 22:24:03 -0700 (PDT) 
Message-ID: <[email protected]> 
From: "Selbie" <[email protected]> 
To: <[email protected]> 
Subject: mail with html in it 
Date: Sun, 27 Mar 2011 22:23:33 -0700 
MIME-Version: 1.0 
Content-Type: multipart/alternative; 
    boundary="----=_NextPart_000_0011_01CBECCD.9BE136B0" 
X-Priority: 3 
X-MSMail-Priority: Normal 
Importance: Normal 


This is a multi-part message in MIME format. 

------=_NextPart_000_0011_01CBECCD.9BE136B0 
Content-Type: text/plain; 
    charset="iso-8859-1" 
Content-Transfer-Encoding: quoted-printable 

This is an HTML mail with various formatting in it. It will still = 
render fine by non-html clients. 




------=_NextPart_000_0011_01CBECCD.9BE136B0 
Content-Type: text/html; 
    charset="iso-8859-1" 
Content-Transfer-Encoding: quoted-printable 

<HTML><HEAD></HEAD> 
<BODY dir=3Dltr> 
<DIV dir=3Dltr> 
<DIV style=3D"FONT-FAMILY: 'Calibri'; COLOR: #000000; FONT-SIZE: 12pt"> 
<DIV>This is an <STRONG>HTML mail</STRONG> with <FONT = 
color=3D#ff0000>various=20 
formatting</FONT> in it.&nbsp; It will still render <FONT=20 
size=3D2><EM>fine</EM></FONT> by non-html <U>clients</U>.</DIV> 
<DIV>&nbsp;</DIV> 
<DIV>&nbsp;</DIV> 
<DIV>&nbsp;</DIV> 
<DIV>&nbsp;</DIV></DIV></DIV></BODY></HTML> 

------=_NextPart_000_0011_01CBECCD.9BE136B0--

출처

2011-03-28 05:35:02 selbie

이것은 흥미로운 대답입니다. –

캠페인 모니터를 보여주는 실제 예를 들어 메일 CSS는 다양한 전자 메일 클라이언트에서 사용할 수없는 것에 대해 훌륭한 자원을 가지고있다 이 차트를 검토하면 HTML/CSS 전자 메일을 작성하는 모범 사례가 웹 페이지의 모범 사례와 매우 다르다는 것을 알 수 있습니다.

출처

2011-03-28 05:48:52 mVChr

고맙습니다. 그것은 나를 많이 도왔다. 이제 "이메일 클라이언트의 가이드 지원"표에 따라 인라인 스타일 HTML을 작성할 수 있습니다. –

CSS를 사용하여 HTML 전자 메일을 작성하는 방법은 무엇입니까?

답변

관련 문제