2012-08-03 2 views
16

iPhone이 화면에 맞게 HTML 전자 메일의 크기를 조정하지 못하게하려고하는데 문제가 있습니다. 아래 코드는 섹션에 넣을 때 아무 효과가없는 것 같습니다.HTML 이메일 크기 조정 iPhone 멈춤 문제

내 목표는 글꼴 크기 조정을 중지하는 것입니다. 나는 -webkit-text-size-adjust : none을 사용하여 다른 변형을 시도했다. 인라인과 다른 방법으로 모두 성공하지 못했습니다.

grealty는 조언이나 대안 솔루션을 제공해 주셔서 감사하겠습니다.

@media 화면과 (최대-장치 폭 : 480 픽셀) {

/*fixes too big font in mobile Safari*/ 
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { 
-webkit-text-size-adjust:none; } }  </style> 
+0

당신은 레이아웃 크기 조정에 대해 이야기하고 있으며 글꼴 크기 조정을 피하려고합니다. HTML이나 테이블에 문제가 없다고 확신합니까? – LeBen

+0

죄송합니다. 분명히해야합니다. 제가해야 할 일은 글꼴 크기 조정을 중단하는 것입니다. 내가 어디서 어떻게 사용하는지에 상관없이 -webkit-text-size-adjust : none; 그것은 작동하지 않는 것 같습니다. 나는 그것을 리트머스에서 광범위하게 시험했다. – jsuissa

+0

스타일 시트 (인라인 또는 기타)는 이메일에서 종종 무시되거나 완전히 삭제됩니다. 대신'style' 속성에 설정해보십시오. 아마도? – 0b10011

답변

-1

망막 아이폰은 640 폭, 미디어 쿼리는 480 픽셀에서 멈 춥니 다.

어쨌든 미디어 쿼리를 모두 제거 할 수 있습니다. 이 속성 (-webkit-text-size-adjust:none)을 사용할 유일한 웹킷 기반 메일 클라이언트는 iPhone 및 iPad의 Mail 응용 프로그램입니다.

또한 메일 응용 프로그램은 또한 CSS3를 지원하는 유일한 클라이언트가 될 수 있습니다 아이폰은 당신이 휴대 전화의 방향을 전환 할 때, 특히 크기 조정 것들에 올 때 통증이있을 것으로 보인다

+0

망막 디스플레이는 동일한 화면 크기를 가지며 DPI 만 변경됩니다. 오래된 iPhones와 동일한 미디어 쿼리에 응답합니다. – LeBen

12

. 뷰포트 설정이있는 메타 태그를 추가하려 했습니까?

<meta name="viewport" content="width=device-width, maximum-scale=1, minimum-scale=1, user-scalable=no"/> 

이 확대 것을 방지 않습니다,하지만 난 방향 변경에 확대에서 아이폰을 중지 할 수있는 더 좋은 방법을 발견하지 않았습니다. 이 상황에서 도움이되는지 확신 할 수는 없지만 시험해보기위한 제안입니다.

+0

좋습니다. 비슷한 것을 시도해 본 결과, 움푹 들어간 것 같지 않습니다. 전체 전자 메일은 화면에 맞게 자동으로 크기가 조정되어 유형이 너무 작습니다. – jsuissa

+0

이 메타 태그를 포함하면 Blackberrys가 이메일 대신 빈 화면을 표시합니다. – samanthasquared

2

당신이하고있는 것은 정확하지만, 문제는 오히려 스타일 태그 안에 -webkit-text-size-adjust:none;를 사용하는 것보다, 당신은 아래의 방법으로 사용한다이다 :

<body style="-webkit-text-size-adjust:none;"> 

이것은 당신이 인라인 CSS로 사용한다는 뜻 재산.

+0

그래서 인라인으로 추가하려고했는데 미디어 쿼리도 제거했습니다. Litmus 테스트는 여전히 전체 전자 메일의 크기가 조정되고 텍스트가 축소 된 것을 보여 주므로 여전히 글꼴 크기를 조정하고 있습니다. – jsuissa

1

은 당신이 당신의 CSS의 body 태그에 다음을 넣어 가지고 그 문제를 제거하려면 다음

-webkit-text-size-adjust: 100%; 

이 방법 사파리 의도 한 크기의 100 %로 텍스트를 유지합니다. 이 값을 none으로 설정하면 사용자가 글꼴을 늘릴 수 없으며 바람직하지 않은 동작입니다.

이 CSS 속성이 지원되며 작동해야합니다.

https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html

는 또한 미디어 유형 화면이 지원되는 점에 유의하시기 바랍니다 :

  • 사파리 4.0 이상

    확인 공식 Safari는 CSS 참조를 지원했다.

  • iOS 1.0 이상

이 정보가 도움이되기를 바랍니다.

BR,
Tolis는

3

나는이 문제 승/갇혀 및 작동 그물에 사용 가능한 해결 방법이 없습니다. 나는 그 원인을 깨닫지 못했습니다.

원인 : 이 문제가 발생하면 이메일/승, 이미지가. 이미지 자동 크기 조정을 수행하면 전체 이메일/페이지가 창에 자동으로 맞춰집니다.

해결책 :분 폭 (300 픽셀 그래서 전체 320 ~ 아이폰 폭을지지 않습니다), 최대 폭 (원하는 최대와)과 의 이미지에 대한 인라인 스타일을 추가 너비 100 %.

즉 이미지 src = "image.jpg"style = "width : 100 %; min-width : 300px, max-width : 500px;"

나를 위해 일했습니다 ...이 도움이 당신을 도울 수 있기를 바랍니다! ;-)