Para modificar el estilo de todo el texto en el talón de empaque de la misma manera, ve a la plantilla de talones de empaque en la configuración de plantilla y agrega el siguiente código al comienzo de la sección Encabezado de pedido:
<style>
* {
font-size:14px;
font-family: Georgia, serif;
color: #4f4f4f;
}
</style>
El * es un selector global. El código anterior establece el tamaño de todo el texto en el talón de empaque en 14px, la fuente en Georgia (o, si Georgia no es una fuente disponible, en la fuente serif estándar) y el color en el valor hexadecimal 4f4f4f (gris oscuro).
Cambia los valores de font-size, font-family y color a los valores que prefieras.
Para modificar el estilo del texto para un elemento específico, en lugar de todo el talón de empaque, agrega el atributo de estilo a la etiqueta de elemento que deseas modificar (este ejemplo agrega las mismas opciones de texto que arriba a la etiqueta <p> para el talón de empaque):
<p align="center" style="font-size:14px; font-family: Georgia, serif; color: #4f4f4f">[Packing Slip Message]</p>
Para lograrlo, agrega el texto en negrita del ejemplo anterior a su código de talón de empaque y cambia los valores para cada estilo según sea necesario.
Para hacer que la fuente en el ejemplo anterior sea negrita, simplemente agrega la propiedad font-weight al atributo de estilo:
style="font-size:14px; font-weight: bold; font-family: Georgia, serif; color: #4f4f4f"
Puedes agregar muchos pares de propiedades y valores a las etiquetas de estilo, ya sea en línea para un solo elemento o entre <style> las etiquetas en la cabecera del código del talón de empaque, para obtener el efecto deseado.
Éstos son los agregados más populares a un atributo de estilo:
-
Negrita
font-weight: bold;
-
Poner en cursiva
font-style: italic;
-
Subrayar
text-decoration: underline;
-
Agregar un color de resaltado al fondo del texto
background-color: yellow;
-
Cambiar el color del texto a rojo
color: red;
-
Cambia el tamaño de la fuente a 18 puntos
font-size: 18pt;
Para modificar parte del texto de un elemento, pero no todo el texto de un elemento, debes agregar etiquetas <span>.
Por ejemplo, haz que el texto "30 días" en esta oración de ejemplo sea rojo con un color amarillo resaltado y en cursiva, pero mantén el texto que rodea igual.
Así es como debería verse esto en la sección Pie de página del pedido de su talón de empaque:
<p align="center" style="font-weight: bold; font-size: 11px">Return items within <span style="font-style: italic; text-decoration: underline; background-color: yellow; color: red;">30 days</span> for a full refund.</p>
Para aprender más formas de dar estilo a elementos de texto como este, visita las páginas de tutoriales HTML & CSS de W3Schools o Mozilla Developer Network.