Los códigos más visitados de HTML

Listado de los códigos más visitados durante los últimos 30 días
Imágen de perfil
Val: 16
Ha disminuido su posición en 3 puestos en HTML (en relación al último mes)
Gráfica de HTML

Login en HTML


621 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(3)
Publicado el 18 de Noviembre del 2018 por Mario
34.430 visualizaciones desde el 18 de Noviembre del 2018
Login hecho en html con css

Screenshot-1
sin imagen de perfil

Tipo de bordes


555 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(10)
Publicado el 16 de Enero del 2003 por Fore (4 códigos)
78.477 visualizaciones desde el 16 de Enero del 2003
Style que permite cambiar el tipo de borde en una tabla.
Imágen de perfil

Juego de la serpiente con Canvas, HTML5 y Jquery


267 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(4)
Publicado el 4 de Agosto del 2014 por Administrador (718 códigos)
24.714 visualizaciones desde el 4 de Agosto del 2014
Este código muestra como utilizando canvas, se puede realizar el juego de la serpiente, donde hay que ir moviendo la serpiente con las teclas para ir comiéndose las fichas. Por cada ficha que se come, la serpiente es un poco mas larga.
Imágen de perfil

Mapa por geolocalización


266 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(22)
Publicado el 11 de Abril del 2015 por Miguel Angel
26.890 visualizaciones desde el 11 de Abril del 2015
Dibujo


El siguiente código permite obtener las coordenadas de la ubicación de un sitio para poder ser mostrado y personalizado mediante geolocalización
Lo primero que hay que hacer es introducir la dirección del sitio que queremos mostrar en nuestro mapa ,nos devolverá las coordenadas ,cambiamos las que mostramos al igual que los datos mostrados en el tooltip , podemos aumentar o disminuir el zoom de visualización del mapa
Imágen de perfil

Texto En 3D!


228 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(5)
Publicado el 23 de Diciembre del 2014 por Luis-miguel- (12 códigos)
14.610 visualizaciones desde el 23 de Diciembre del 2014
Crearemos cualquier texto en 3d para nuestra Página Web!

foto_2242
Imágen de perfil
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Vídeo Fullscreen Responsive


212 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 5 de Enero del 2022 por Scriptshow (141 códigos)
2.480 visualizaciones desde el 5 de Enero del 2022
Saludos,

HTML5 y CSS3 para hacer un Vídeo Fullscreen Responsive. Un pequeño Script asegura el arranque en diversos dispositivos y navegadores web.

Veamos el código completo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
 
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Full Screen Video Background</title>
<style type="text/css">
* {
margin:0;
padding:0;
}
 
html,body {
height:100%;
}
 
body {
font-size:16px;
font-family:"Helvetica", sans-serif;
line-height:1.5;
color:#FFFFFF;
}
 
.content {
position:relative;
top:28%;
z-index:2;
margin:0 auto;
max-width:640px;
text-align:center;
}
 
.video {
position:fixed;
top:50%;
left:50%;
z-index:1;
min-width:100%;
min-height:100%;
width:auto;
height:auto;
-webkit-transform:translate(-50%, -50%);
-ms-transform:translate(-50%, -50%);
-o-transform:translate(-50%, -50%);
transform:translate(-50%, -50%);
}
</style>
</head>
<body>
<div class="content">
<h1>Video Full Screen Test</h1>
<p>Este Vídeo Background Responsive se adapta al tamaño de dispositivos y navegadores.</p>
<a href="#">Test</a>
</div>
 
<video id="video" class="video" muted loop>
<source src="video.mp4" type="video/mp4">
<source src="video.ogv" type="video/ogg">
<source src="video.webm" type="video/webm">
</video>
 
<script type="text/javascript">
(function() {
var video=document.getElementById("video");
video.addEventListener("canplay", function() {video.play()});
})();
</script>
</body>
</html>

Espero sea útil.
Imágen de perfil

Sitio web html 5 con Css3 y Js


189 visualizaciones el último mes

HTML

Publicado el 14 de Diciembre del 2021 por David (3 códigos)
2.060 visualizaciones desde el 14 de Diciembre del 2021
https://github.com/nob322/WebHtml5Css3Js-1
Les comparto el código completo para que se lo clonen, ideal para quienes están aprendiendo a crear sitios web, implementé un par de librerías de js muy potentes.
Imágen de perfil
Val: 88
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Login responsive


188 visualizaciones el último mes

HTML

Publicado el 7 de Abril del 2020 por John Alexander (10 códigos)
4.716 visualizaciones desde el 7 de Abril del 2020
En este código podrás ver cómo hacer el FRONTEND de un login con HTML y CSS.


Captura-de-pantalla-198
Imágen de perfil
Val: 88
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Efecto PARALLAX


136 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(3)
Publicado el 7 de Abril del 2020 por John Alexander (10 códigos)
3.330 visualizaciones desde el 7 de Abril del 2020
En este código podás ver cómo hacer una página web que tiene un efecto PARALLAX solo con HTML y CSS.


Captura-de-pantalla-197
Imágen de perfil
Val: 159
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Mapa interactivo de comunidades de españa


135 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Actualizado el 9 de Octubre del 2015 por Xavi (548 códigos) (Publicado el 16 de Junio del 2014)
18.725 visualizaciones desde el 16 de Junio del 2014
Código que muestra como hacer una mapa interactivo de españa, donde al pasar el ratón por encima de las comunidades, se marca la comunidad y muestra su nombre.
Se utiliza css y jquery.

Puedes ver un ejemplo aquí aquí
Imágen de perfil
Val: 10
Ha aumentado su posición en 135 puestos en HTML (en relación al último mes)
Gráfica de HTML

Obtener valor(id) de una tabla html


127 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 9 de Junio del 2021 por Sergio (7 códigos)
3.367 visualizaciones desde el 9 de Junio del 2021
Obtener valor de una fila en una tabla html

Codigo en html, jquery, bootstrap para obtener el id de cada fila de una tabla html, MUY UTIL para cualquier tipo de accion.

https://gitlab.com/savila/get_id_table_row
hjb
Imágen de perfil
Val: 74
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Key Code


125 visualizaciones el último mes

HTML

Publicado el 24 de Enero del 2015 por Txema (7 códigos)
10.666 visualizaciones desde el 24 de Enero del 2015
Página sencilla HTML en la que podemos ver los códigos de cada elemento de nuestro teclado.

Útil para cuando, en programación, queremos bloquear o comprobar la tecla que pulsa el usuario.

Funciona tanto en local como en web

Los Key Code que se describen en el código no son todos los que puede solucionar.
v.gr,: los números en el teclado ordinario y en el numérico, punto (como decimal y ortográfica, guión y signo menos ...).
sin imagen de perfil

Matrix


105 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(15)
Publicado el 2 de Abril del 2004 por Corpol (35 códigos)
74.797 visualizaciones desde el 2 de Abril del 2004
Este código simula el efecto de la matrix a pantalla completa con ayuda de imágenes.
Imágen de perfil
Val: 159
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Contenido Editable en HTML5


88 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 15 de Julio del 2013 por Xavi (548 códigos)
10.551 visualizaciones desde el 15 de Julio del 2013
Código que muestra como utilizar la propiedad contenteditable para permitir editar un párrafo de nuestra web.
Imágen de perfil
Val: 88
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Botones interactivos


87 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 8 de Abril del 2020 por John Alexander (10 códigos)
3.015 visualizaciones desde el 8 de Abril del 2020
En este código podrás ver cómo hacer 3 botones interactivos los cuales activan una sombra de neón cuando colocas el cursor sobre alguno de ellos.

(No responsive)


Captura-de-pantalla-203
Imágen de perfil
Val: 88
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Enciclopedia estilo Wikipedia


83 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 5 de Abril del 2020 por John Alexander (10 códigos)
1.901 visualizaciones desde el 5 de Abril del 2020
En este código podrás ver como resultado el molde para una pequeña enciclopedia estilo Wikipedia.


Lenguajes usados:
HTML
CSS
JAVASCRIPT


Captura-de-pantalla-191
Imágen de perfil
Val: 88
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Esfera del dragón


82 visualizaciones el último mes

HTML

Publicado el 8 de Abril del 2020 por John Alexander (10 códigos)
2.351 visualizaciones desde el 8 de Abril del 2020
En este código podrás ver cómo hacer una esfera del dragón de la serie "Dragon ball"
solo con HTML y CSS.


Captura-de-pantalla-202
Imágen de perfil
Val: 14
Ha disminuido su posición en 2 puestos en HTML (en relación al último mes)
Gráfica de HTML

HTML DESDE CERO COMO SI ESTUVIERA EN EL COLEGIO


81 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 23 de Julio del 2020 por Oswaldo Alberto (6 códigos)
2.629 visualizaciones desde el 23 de Julio del 2020
Cordial saludo.

El presente código fuente trata de Html, desde lo básico hasta el manejo de formularios, manejo de tablas, manejo de frames (ojo ya no se usan, pero por tratarse de enseñanza se ejemplarizan).

Finalmente se aplica el uso de formularios con tablas, es un concepto fui facil de aprender, para luego aplicarlo a sus necesidades. Con base a todo lo anterior, podrá seguir estudiando CSS el cual complementa el Html, y en un futuro muy cercano estudiar Html5 y CSS3.

Recuerden que en Internet existen muchos recursos presentados en muchos formatos para estudiar para aprender. "La vida es muy corta... vívela al máximo, como si fuera tu último día..."

Gracias,
Oswaldo Serrano
[email protected]

Foto-HV-Oswaldo-Serrano
Html
sin imagen de perfil

Cambiar el cursor


79 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(3)
Publicado el 24 de Diciembre del 2002 por Kovi
52.151 visualizaciones desde el 24 de Diciembre del 2002
Código que cambia el cursor dentro de la pagina o enlace. Probado con IE 6.
Imágen de perfil
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Plantilla HTML para Web 2.0


79 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(13)
Actualizado el 22 de Febrero del 2020 por Scriptshow (141 códigos) (Publicado el 19 de Agosto del 2017)
9.258 visualizaciones desde el 19 de Agosto del 2017
Una Web 2.0 basada en HTML y CSS compatible.

Un efecto Parallax y Reveal para presentar todos los contenidos desplazando la barra de Scroll.
La estructura es ampliable, adaptable, compatible con cualquier pantalla y/o dispositivo.
La respuesta del Sitio es ágil y rápida con imágenes optimizadas.

Un Saludo
Imágen de perfil
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Web 2.0 Light / Dark Style


79 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(3)
Actualizado el 22 de Febrero del 2022 por Scriptshow (141 códigos) (Publicado el 4 de Mayo del 2020)
4.564 visualizaciones desde el 4 de Mayo del 2020
Saludos,

Web 2.0 es un proyecto creado desde cero con unos 6Kb. Se caracteriza por ser muy flexible, adaptable con mínimos cambios en el código. No depende de librerías de nigún tipo, es 100% Código Nativo Compatible.
Tiene múltiples y variadas aplicaciones: Web Personal, Portafolio para Fotógrafos, Arquitectos, Diseñadores, Freelancers, etc...

Espero sea útil.
sin imagen de perfil

Pagina de Inicio


72 visualizaciones el último mes

HTML

estrellaestrellaestrellaestrellaestrella(17)
Publicado el 25 de Febrero del 2004 por Mario (3 códigos)
58.213 visualizaciones desde el 25 de Febrero del 2004
Código para establecer la pagina de inicio del navegador.
Imágen de perfil
Val: 8
Ha aumentado su posición en 9 puestos en HTML (en relación al último mes)
Gráfica de HTML

Menú Bootstrap


72 visualizaciones el último mes

HTML

Actualizado el 9 de Abril del 2021 por Carlos Luis (2 códigos) (Publicado el 20 de Agosto del 2017)
4.299 visualizaciones desde el 20 de Agosto del 2017
Menú Bootstrap configurable referente al color.

Resumen:

Muchas veces necesitamos tener una barra de navegación (navbar), diferente al color por defecto o al color inverso.

En ese caso utilizamos google para buscar soluciones. En mi caso, encontré algunas pero siempre me parecían muy complicadas; así que después de algún tiempo estudiando llegue a esta barra.

Espero sea de su utilidad y les ayude a aclarar un poco el tema.

Y con el permiso de autor de este vídeo, me permito recomendarlo: