HTML+CSS를 사용하여 이메일 웹페이지를 만드는 예 요약

이메일 마케팅을 할 때 우리 모두는 사용자가 이메일을 열 때 완전한 웹 페이지를 볼 수 있기를 바랍니다. 그러나 이메일의 HTML 페이지 렌더링은 브라우저의 렌더링과 다르며 렌더링 기능도 훨씬 작습니다. 브라우저에 정상적으로 표시되는 효과는 이메일에 잘못 표시되거나 렌더링될 수 없습니다. 수많은 테스트를 거쳐 웹 이메일을 디자인하고 제작할 때 다음 사항에 주의해야 합니다.

1. 어떤 형태의 배경 이미지도 사용할 수 없습니다.

2. 스타일은 반드시 HTML 코드로 작성해야 합니다. style="text-dressation:none; color:#666;font-size:12px;"와 유사합니다. 또한 의 스타일을 본문에 배치해야 작동합니다. 전달 시 일부 스타일이 손실되므로 사용하지 않는 것이 좋습니다

3. 각 사진에 Alt 및 제목을 추가하세요

4. 많은 사용자가 노트북을 사용하고 있으므로 해상도를 고려하세요. 노트북의 크기는 1280*708입니다. . . 따라서 좋은 사용자 경험을 위해서는 적절한 너비가 있어야 합니다

5. 모든 사진은 절대 주소를 사용해야 합니다. 그렇지 않으면 클라이언트 터미널에는 표시되지 않지만

6. 레이아웃은 테이블을 사용하고 div는 사용하지 마세요. margin:0 auto도 메일함에서 작동하지 않고 CSS 속성이 모두 테스트되지는 않았지만 실제로 제한되어 있으므로 테이블을 사용하세요.

7. 모든 블록 너비, 너비를 쓰지 않으면 설명할 수 없는 버그가 발생합니다.

8. 표시 효과는 사서함에 따라 달라지는 경우가 있습니다.

위험 경고:

창을 어느 정도 축소하면 일부 사진이 줄어들고 페이지 경계가 고르지 않게 됩니다. 이는 현재 디자인으로는 이 버그를 피할 수 없습니다. , 따라서 너비는 더 작은 크기로만 변경할 수 있습니다(NetEase Mailbox Center에서 보낸 시스템 메일을 테스트하면 이 문제도 존재합니다).

위 내용은 HTML+CSS를 사용하여 이메일 웹페이지를 만드는 예 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!