html - blue - edison mail
HTML correo electrónico detección de formato iOS (5)
Acabo de descubrir que la detección de formato no funciona para Outlook.com, Office365, etc.
En mi caso, no quería el estilo O la funcionalidad automática (de hacer clic para llamar o asignar una dirección), así que inyecté algo de HTML oculto para que no pareciera una dirección.
Original:
<td>123 Main Street
<br/>Cambridge, MA 02138</td>
Actualizado:
<td>123 Main S<i class="hidden">-</i>treet
<br/>Cambridge, M<i class="hidden">-</i>A 02<i class="hidden">-</i>138</td>
Con esto añadido a su hoja de estilo:
.hidden { display:none; }
Esto se probó y funciona en las más o menos 50 vistas previas de los clientes de correo electrónico que ofrece Email on Acid.
NOTA: no puede alinear la pantalla: ninguna porque Yahoo Mail no admite eso y terminará con guiones visibles en su dirección. Necesitas definir una clase.
Eliminar pantalla pero manteniendo la funcionalidad.
Si desea mantener la funcionalidad emergente de Bing Maps, puede personalizar la pantalla agregando la clase "outlookLink" al elemento que contiene la dirección. Fuente: https://litmus.com/community/discussions/4692-outlook-com-adding-links
Así que esto:
<td>123 Main Street</td>
Se convierte en esto:
<td class="outlookLink">123 Main Street</td>
con lo siguiente en su hoja de estilo:
.outlookLink span {
color:#ffffff !important;
border-bottom-width:0 !important;
border-bottom-style:none !important;
}
Outlook.com envuelve lo que determina como direcciones o fechas (para las entradas del calendario) en un <span> con su propio estilo (enlace azul con subrayado discontinuo). Esto modifica el estilo de esos <span> s.
Acabo de descubrir que hay una etiqueta meta para eliminar el número de teléfono como un enlace en HTML en iOS. ¿Esto funciona con correos electrónicos HTML?
<meta name="format-detection" content="telephone=no">
Pero ¿hay uno para la dirección y la fecha también? Siempre he estado escribiendo hacks para superar esto, pero si es una etiqueta meta, ¡es genial! ¿Alguien sabe la sintaxis de la dirección y la fecha?
He tenido suerte con:
<style>
a[href^="x-apple-data-detectors:"] {
color: inherit;
text-decoration: inherit;
}
</style>
Sí hay. Puedes usar:
- Fecha:
<meta name="format-detection" content="date=no"> - Dirección:
<meta name="format-detection" content="address=no"> - Correo electrónico:
<meta name="format-detection" content="email=no">
Combinándolos:
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="date=no">
<meta name="format-detection" content="address=no">
<meta name="format-detection" content="email=no">
no probado pero debería funcionar.
a[href^=date]{ color:#FFFFFF; text-decoration:none;}
a[href^=telephone]{ color:#FFFFFF; text-decoration:none;}
a[href^=address]{ color:#FFFFFF; text-decoration:none;}
a[href^=email]{ color:#FFFFFF; text-decoration:none;}
<html>
<head>
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="date=no">
<meta name="format-detection" content="address=no">
<meta name="format-detection" content="email=no">
<style type="text/css">
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
</style>
</head>
<body>
123 Main Street<br/>
Columbus, Ohio 43215
</body>
</html>