Algunos Códigos HTML

ALGUNOS CÓDIGOS HTML

---

USAR COMENTARIOS EN HTML

<!-- texto en comentario -->

Aplicación:

<!-- texto en comentario -->

---

BORDE PARA IMAGEN

style="margin: 0px 0 10px 10px; float: center; padding: 10px; border: 1px solid #ddd;"

Aplicación:

<img src="imagen.jpg" style="margin: 0px 0 10px 10px; float: center; padding: 10px; border: 1px solid #ddd;">

Demo:

---

OTROS BORDES EN CSS

Redondo azul claro
style="padding: 3px 10px; border: PowderBlue 5px solid; border-radius: 20px;" 

Sencillo negro
style="border:1px solid black;"

otros-bordes1 | bordes2 | bordes3

---

BOTÓN CON HIPERVÍNCULO

<input onclick="window.open('el-enlace-web', '_blank');" type="button" value="texto del enlace" >

Aplicación:

<input onclick="window.open('http://www.gmail.com', '_blank');" type="button" value="Ir a correo Gmail" >

Demo:

---

OTRO BOTÓN

<a href="el-enlace-web" target="_blank" title=""

style="display: inline-block; padding: 8px 16px; 

background-color: white; color: rgb(0, 0, 139); 

border: 1px solid red; border-radius: 6px; 

text-decoration: none;" 

onmouseover="this.style.backgroundColor='#f0f0f0'" 

onmouseout="this.style.backgroundColor='white'">

    texto del enlace

</a>

Aplicación:

<a href="http://www.gmail.com" target="_blank" title="" style="display: inline-block; padding: 8px 16px; background-color: white; color: rgb(0, 0, 139); border: 1px solid red; border-radius: 6px; text-decoration: none;" onmouseover="this.style.backgroundColor='#f0f0f0'" onmouseout="this.style.backgroundColor='white'"> Abrir GMAIL </a>

Demo:

Abrir GMAIL

---

AUTOEJECUTAR VIDEO YOUTUBE

Se Agrega ?mute=1&rel=0&autoplay=1 al final de la ruta de youtube, sin dejar espacio y antes de cerrar comillas.

Aplicación:

<iframe width="560" height="315" src="https://www.youtube.com/watch?v=63dhQrufMwA?mute=1&rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>

Demo:

Para escuchar el SONIDO ... click en el video y presiona las letras
(m) mute → silenciar y (k) play → ejecutar

---

COLOCAR FAVICON

Se Agrega la línea link rel="shortcut icon" href="ruta de la imagen" como una etiqueta dentro del Head de la página web.

Aplicación:

<link rel="shortcut icon" href="https://la.ixl.com/ixl-favicon.png">

Demo:

---

ANCHO Y ALTO

El ancho y el alto es muy utilizado para ajustar el tamaño de una imagen y de un video. Ancho: width="400" Alto: height="60" estas dos instrucciones son las necesarias.

Aplicación:

<img src="graficos/bannerGanarDinero.jpg" width="400" height="60" />

Demo:

Regálame un comentario o Comparte por Redes Sociales!

👨‍💻 a.liloy