Si no desea usar CSS, solo use las etiquetas
, generalmente 2 de ellas, para separar los bloques de texto. Nunca uso etiquetas p debido a la larga lista de problemas con ellas en el correo electrónico HTML.
Outlook impone su propia altura de línea y no escucha correctamente cuando intenta agregar relleno o margen. Outlook> 7 no rellena las etiquetas p, y el margen debe aplicarse correctamente. Yahoo Mail elimina los márgenes p por completo. Etc, etc., solo use
para separar sus bloques de texto.
- ¿Cuál es el mejor: Ruby on Rails, MEAN o Drupal?
- ¿Cuáles son los mejores complementos gratuitos de WordPress para un nuevo sitio?
- ¿Hay alguna alternativa más fácil a CodeWars que sea compatible con Ruby?
- ¿Dónde puedo obtener más información sobre stack medio?
- Cómo copiar mi página de inicio de WordPress a una página estática para poder configurar la página de inicio como Estática y señalarla sin los blogs
Si realmente necesita un espacio de tipografía cercano al preciso, tómese el tiempo para separar cada bloque de texto en una fila de la tabla y use relleno en las celdas de la tabla. Inline en cada uno de ellos.
Recuerde que el HTML en un correo electrónico no es HTML normal. Para cuando la mayoría de los clientes de correo electrónico lo procesan, se ha realizado todo tipo de preprocesamiento en su código.
…
Si desea utilizar CSS, restablezca las propiedades de las etiquetas p para los clientes de correo electrónico problemáticos y establezca el espaciado de cada párrafo utilizando márgenes sin acceso directo en línea. Aquí está la parte del restablecimiento del correo electrónico en ácidos:
// restablece el espaciado de clase de Outlook específico
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {
altura de línea: 100%;
}
p {margen: 0; relleno: 0; margen inferior: 0;}
/ * luego establece cada estilo de etiquetas p en línea * /
Yo uso las plantillas de MailChimp que usan un reinicio específico del cliente slew:
/ * / \ / \ / \ / \ / \ / \ / \ / \ / ESTILOS ESPECÍFICOS DEL CLIENTE / \ / \ / \ / \ / \ / \ / \ / \ / * /
#outlook a {padding: 0;} / * Forzar Outlook para proporcionar un mensaje de “vista en el navegador” * /
.ReadMsgBody {ancho: 100%;} .ExternalClass {ancho: 100%;} / * Forzar Hotmail para mostrar correos electrónicos en todo el ancho * /
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} / * Forzar Hotmail para mostrar el espaciado de línea normal * /
body, table, td, p, a, li, blockquote {-webkit-text-size-ajustar: 100%; -ms-text-size-ajustar: 100%;} / * Evitar que WebKit y Windows mobile cambien los tamaños de texto predeterminados * /
tabla, td {mso-table-lspace: 0pt; mso-table-rspace: 0pt;} / * Eliminar el espacio entre tablas en Outlook 2007 y versiones posteriores * /
img {-ms-interpolation-mode: bicubic;} / * Permitir una representación más fluida de la imagen redimensionada en Internet Explorer * /
Tanto Email on Acid como MailChimp ofrecen plantillas gratuitas para comenzar que resuelven muchos problemas por usted.
Asegúrese de realizar la prueba en el cliente de correo electrónico tal como lo recibe de su proveedor de servicios de correo electrónico y no solo reenviar el correo electrónico. El reenvío realmente arruina las cosas. Pruebe en una herramienta de prueba seria como Litmus o Email on Acid, valen la suscripción mensual (aunque Email on Acid es mucho más barato).
