Skip to main content
se añadieron 4 caracteres en el cuerpo
Origen Enlace
masterguru
  • 16k
  • 5
  • 15
  • 28

Estoy intentando crear una firma personalizada en HTML para la empresa en donde trabajo y me estoy encontrando con dos problemas: el primero es que no estoy pudiendo importar la fuente externa. Veo la misma cuando lo diseño y previsualizo en mi explorador, pero en cuanto lo copio y pego en Gmail, se pierde esa fuente. Ya he probado con @import, @font-face y también con link del en el head.

El segundo inconveniente es más una pregunta: si quiero utilizar una imagen (png, svg, etc.), ¿debería subirla a un servidor y linkearla? O es suficiente con usar el svg desde mi directorio local y al copiar la firma se copia dicho archivo también.

Este es el código que armé hasta ahora.

<body style="margin: 0;">
<div  style="display: grid;grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 35px 35px 35px;height: 100px;grid-column-gap: 1.5rem; grid-row-gap: .5rem;align-items: center;">
    <img src="SVG/EMPTRESA.svg"alt="Logo" style="height:100%; grid-row: 2 span;">
    <p class="nombre" style="grid-row: 2 span;color: #3131FF;font-family: 'Anton', sans-serif;font-weight:400;font-size: 5rem;white-space: nowrap;">NOMBRE DE LA PERSONA</p>
    <p style="color: #3131FF;">Teléfono 1</p>
    <img src="SVG/APCP.svg" style="height: 100%;grid-row: 2 span;" alt="">
    <p style="color: #3131FF;">Teléfono 2</p>
    <div></div>
    <p style="color: #3131FF;font-family: Archivo Narrow;font-weight: bold;">SPAIN - EXCECUTIVE PRODUCER</p>
    <p style="color: #3131FF;">EMPRESA</p>
    <div></div>
</div>
</body>
  

Gracias!!

Estoy intentando crear una firma personalizada en HTML para la empresa en donde trabajo y me estoy encontrando con dos problemas: el primero es que no estoy pudiendo importar la fuente externa. Veo la misma cuando lo diseño y previsualizo en mi explorador, pero en cuanto lo copio y pego en Gmail, se pierde esa fuente. Ya he probado con @import, @font-face y también con link del en el head.

El segundo inconveniente es más una pregunta: si quiero utilizar una imagen (png, svg, etc.), ¿debería subirla a un servidor y linkearla? O es suficiente con usar el svg desde mi directorio local y al copiar la firma se copia dicho archivo también.

Este es el código que armé hasta ahora.

<body style="margin: 0;">
<div  style="display: grid;grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 35px 35px 35px;height: 100px;grid-column-gap: 1.5rem; grid-row-gap: .5rem;align-items: center;">
    <img src="SVG/EMPTRESA.svg"alt="Logo" style="height:100%; grid-row: 2 span;">
    <p class="nombre" style="grid-row: 2 span;color: #3131FF;font-family: 'Anton', sans-serif;font-weight:400;font-size: 5rem;white-space: nowrap;">NOMBRE DE LA PERSONA</p>
    <p style="color: #3131FF;">Teléfono 1</p>
    <img src="SVG/APCP.svg" style="height: 100%;grid-row: 2 span;" alt="">
    <p style="color: #3131FF;">Teléfono 2</p>
    <div></div>
    <p style="color: #3131FF;font-family: Archivo Narrow;font-weight: bold;">SPAIN - EXCECUTIVE PRODUCER</p>
    <p style="color: #3131FF;">EMPRESA</p>
    <div></div>
</div>
 

Gracias!!

Estoy intentando crear una firma personalizada en HTML para la empresa en donde trabajo y me estoy encontrando con dos problemas: el primero es que no estoy pudiendo importar la fuente externa. Veo la misma cuando lo diseño y previsualizo en mi explorador, pero en cuanto lo copio y pego en Gmail, se pierde esa fuente. Ya he probado con @import, @font-face y también con link del en el head.

El segundo inconveniente es más una pregunta: si quiero utilizar una imagen (png, svg, etc.), ¿debería subirla a un servidor y linkearla? O es suficiente con usar el svg desde mi directorio local y al copiar la firma se copia dicho archivo también.

Este es el código que armé hasta ahora.

<body style="margin: 0;">
<div  style="display: grid;grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 35px 35px 35px;height: 100px;grid-column-gap: 1.5rem; grid-row-gap: .5rem;align-items: center;">
    <img src="SVG/EMPTRESA.svg"alt="Logo" style="height:100%; grid-row: 2 span;">
    <p class="nombre" style="grid-row: 2 span;color: #3131FF;font-family: 'Anton', sans-serif;font-weight:400;font-size: 5rem;white-space: nowrap;">NOMBRE DE LA PERSONA</p>
    <p style="color: #3131FF;">Teléfono 1</p>
    <img src="SVG/APCP.svg" style="height: 100%;grid-row: 2 span;" alt="">
    <p style="color: #3131FF;">Teléfono 2</p>
    <div></div>
    <p style="color: #3131FF;font-family: Archivo Narrow;font-weight: bold;">SPAIN - EXCECUTIVE PRODUCER</p>
    <p style="color: #3131FF;">EMPRESA</p>
    <div></div>
</div>
</body>
 

Gracias!!

Origen Enlace

Firma HTML - Logo y fuente externa

Estoy intentando crear una firma personalizada en HTML para la empresa en donde trabajo y me estoy encontrando con dos problemas: el primero es que no estoy pudiendo importar la fuente externa. Veo la misma cuando lo diseño y previsualizo en mi explorador, pero en cuanto lo copio y pego en Gmail, se pierde esa fuente. Ya he probado con @import, @font-face y también con link del en el head.

El segundo inconveniente es más una pregunta: si quiero utilizar una imagen (png, svg, etc.), ¿debería subirla a un servidor y linkearla? O es suficiente con usar el svg desde mi directorio local y al copiar la firma se copia dicho archivo también.

Este es el código que armé hasta ahora.

<body style="margin: 0;">
<div  style="display: grid;grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 35px 35px 35px;height: 100px;grid-column-gap: 1.5rem; grid-row-gap: .5rem;align-items: center;">
    <img src="SVG/EMPTRESA.svg"alt="Logo" style="height:100%; grid-row: 2 span;">
    <p class="nombre" style="grid-row: 2 span;color: #3131FF;font-family: 'Anton', sans-serif;font-weight:400;font-size: 5rem;white-space: nowrap;">NOMBRE DE LA PERSONA</p>
    <p style="color: #3131FF;">Teléfono 1</p>
    <img src="SVG/APCP.svg" style="height: 100%;grid-row: 2 span;" alt="">
    <p style="color: #3131FF;">Teléfono 2</p>
    <div></div>
    <p style="color: #3131FF;font-family: Archivo Narrow;font-weight: bold;">SPAIN - EXCECUTIVE PRODUCER</p>
    <p style="color: #3131FF;">EMPRESA</p>
    <div></div>
</div>

Gracias!!