Plantillas HTML para anuncios y encabezados

Plantillas HTML para anuncios y encabezados

Plantilla # 1

pa[pic 1]ÉCNI

<div style="width: 100%; background-color: #007DBC; background-repeat:no-repeat;

background-position:bottom; background-size: contain;">

<div style="max-width: 800px; margin: 0 auto; display: flex; align-items: center; font-family: Arial, Helvetica, sans-serif;">

<div style="width: 50%; padding: 20px; margin: 20px; text-align: center;"><img alt="imagen" src="/content/index.php/institucion/Titulada/institution/SENA/Salud/134507_2/Audiovisuales/Imagenes/guia4.png" width="100%" /></div>

<div style="width: 50%; padding: 20px;">

<p style="color: #;"><span style="color:#FFFFFF;"><strong>TÉCNICO EN APOYO ADMINISTRATIVO EN SALUD</strong></span></p>

<p><span style="color:#FFFFFF;">En este espacio podrá acceder a las imágenes utilizadas en el programa de formación:</span></p>

<hr align="left" style="width: 20%; border: 2px solid #FFCA7D; margin-bottom: 15px;" />

<p style="background-color: #EDF2F5; padding: 5px; margin: 5px; border-radius: 6px; text-align: center;"><a href="https://sena.territorio.la/content/index.php/institucion/Titulada/institution/SENA/Salud/134507_2/Audiovisuales/Imagenes/Imagenes_utilizadas.zip" style="text-decoration: none; color: black;" target="_blank">Imágenes utilizadas</a></p>

</div>

</div>

</div>

Anuncio 1

[pic 2]

<div style="width: 100%; background-color: #007DBC; background-repeat:no-repeat;

background-position:bottom; background-size: contain;">

<div style="max-width: 900px; margin: 0 auto; display: flex; align-items: center; font-family: Arial, Helvetica, sans-serif;">

<div style="width: 50%; padding: 20px;">

<p style="color: white;"><strong>TÉCNICO EN APOYO ADMINISTRATIVO EN SALUD</strong></p>

<h2 style="color: white;">Texto de bienvenida</h2>

<p align="justify"><span style="color:white;">Estimados aprendices SENA.</span></p>

<p align="justify"><span style="color:white;">Una cordial bienvenida para todos, les deseo lo mejor en el desarrollo de esta experiencia virtual con el programa de formación titulada <b>"</b><strong>Técnico en apoyo administrativo en salud</strong><b>"</b>.</span></p>

<p align="justify"><span style="color:white;">Mi nombre es <strong>XXXXXX XXXXX XXXXX</strong>, seré su instructor, recuerden que estoy para ayudarlos y guiarlos durante su proceso de aprendizaje, me pueden contactar a través del foro de dudas e inquietudes o al correo electrónico <strong>XXXXXXXXX@xxxxxxx.xxxx</strong>, o en el celular: xxxxxxxxxx.</span></p>

<p align="justify"><span style="color:white;">Es importante que dediquen el tiempo necesario para su formación. Los invito a que conozcan la plataforma haciendo un recorrido por cada unos de los enlaces dispuestos en ella.</span></p>

<p align="justify"><span style="color:white;">¡Muchos éxitos!</span></p>

<p align="justify"><span style="color:white;">NOTA: estimado instructor recuerde que debe personalizar el texto del anuncio antes de ser publicado a los aprendices.</span></p>

<p> </p>

<hr align="left" style="width: 20%; border: 2px solid #FFCA7D; margin-bottom: 15px;" /></div>

<div style="width: 50%; padding: 20px; margin: 20px; text-align: center;"><img alt="imagen" src="/content/index.php/institucion/Titulada/institution/SENA/Salud/134507_2/Audiovisuales/Imagenes/material2.png" width="70%" /></div>

</div>

</div>

Plantilla # 2

[pic 3]

<div style="width: 100%; background-color: #007DBC; background-repeat:no-repeat;

background-position:bottom; background-size: contain;">

<div style="max-width: 800px; margin: 0 auto; display: flex; align-items: center; font-family: Arial, Helvetica, sans-serif;">

<div style="width: 50%; padding: 20px; width: 50%; padding: 20px; color: white; font-size: 16px; text-align: justify;">

<p style="color: #ffffff;">TÉCNICO EN APOYO ADMINISTRATIVO EN SALUD</p>

<p style="color: #3fabf2"><span style="font-size:16px;"><span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; font-family: Arial; line-height: 18.4px; font-size: 16px;"><span style="color:#FFFFFF;">Navegue utilizando los botones</span> <i class="fa fa-home" style="color:#AE8A23;font-size: 20px;"> </i><i class="fa fa-arrow-circle-o-left" style="color:#AE8A23;font-size: 20px;"> </i> <i class="fa fa-arrow-circle-o-right" style="color:#AE8A23;font-size: 20px;"> </i> <span style="color:#FFFFFF;">para explorar: </span></span></span></p>

<ul>

        <li>Imágenes utilizadas</li>

        <li>Plantillas HTML</li>

</ul>

</div>

<div style="width: 50%; padding: 20px; margin: 20px; text-align: center;"><img alt="imagen" src="https://sena.territorio.la/content/index.php/institucion/Titulada/institution/SENA/Salud/134507_2/Audiovisuales/Imagenes/instrucciones.png" width="70%" /></div>

</div>

</div>

Plantilla # 3

[pic 4]

<div style="width: 100%; background-color: #007DBC; background-repeat:no-repeat;

background-position:bottom; background-size: contain;">

<div style="max-width: 800px; margin: 0 auto; display: flex; align-items: center; font-family: Arial, Helvetica, sans-serif;">

<div style="width: 50%; padding: 20px; margin: 20px; text-align: center;"><img alt="imagen" src="/content/index.php/institucion/Titulada/institution/SENA/Salud/134507_2/Audiovisuales/Imagenes/material1.png" width="100%" /></div>

...