Tailwind CSS - Centrar verticalmente
En este corto tutorial de programación CSS con Tailwind vamos a ver cómo centrar un elemento verticalmente. ...
En este corto tutorial de programación CSS con Tailwind vamos a ver cómo centrar un elemento verticalmente. ...
En el blog ya he escrito sobre cómo usar TailwindCSS con Vue 3 y Vite, pero no he hablado sobre cómo usarlo sin ningún framework, es decir, usar Tailwind CSS con HTML plano y puro, cosa que sí es totalmente posible. ...
En este post vamos a ver cómo usar los iconos de Material design en nuestros proyectos web al usar Vue 3. Te voy a mostrar una manera en la que al final vas a incluir en tu proyecto solo los iconos que has usado, haciendo tu software mucho más ligero. Para tener los Material design icons en Vue 3 vamos a usar el paquete vue-material-design-icons que a su vez es simplemente una colección de componentes de Vue que usan los Material Design Icons. ...
En este post te voy a enseñar a agregar Tailwind CSS a un proyecto de Vue 3. Básicamente es seguir la guía oficial, pero con unos pasos extra desde mi experiencia. ...
En el post de hoy te mostraré algo muy simple: cómo centrar una imagen HTML usando CSS, sin frameworks.alinear una imagen al centro Si bien es algo sencillo, en ocasiones olvidamos cómo hacerlo. Así que en este artículo te mostraré el estilo CSS para centrar un elemento img. ...
En este post te mostraré una plantilla HTML que tiene los elementos o etiquetas header, section, aside y footer. Es un simple ejemplo con HTML y CSS para una página web. El aside y el section tienen la misma altura, y el aside es mostrado a la derecha con un borde. Obviamente tú podrás cambiar los colores o el estilo, aquí solo te dejo una plantilla HTML muy simple con CSS puro. ...
Hoy te mostraré cómo hacer una cuadrícula o grid en donde cada sección se acople a la pantalla de manera automática y dinámica sin que tú sepas la cantidad de columnas que habrá. Esto es útil para cuando tenemos contenido dinámico (ya sea generado por el lado del cliente o del servidor) y queremos que las tarjetas o cuadros sobrantes se bajen automáticamente a otra fila. Básicamente haremos una cuadrícula que ajuste el contenido dinámico usando bulma y sus columnas. Verás que es muy sencillo. ...
Hace unos días te mostré cómo resolver fracciones o quebrados usando JavaScript y programación orientada a objetos para hacer las operaciones como suma, resta, multiplicación y división. Hoy te traigo un ejemplo práctico de un solucionador de operaciones de fracciones online que recién he programado. Por cierto, si tú solo eres un usuario que está interesado en usar el software puedes entrar directamente al solucionador de fracciones en línea. ...
En este tutorial te enseñaré cómo alojar tu sitio web o aplicación web en GitHub totalmente gratis. Si bien GitHub no está pensado como un servicio de hosting, podemos ejecutar nuestras aplicaciones dentro del servicio. Te enseñaré cómo usar GitHub para servir tu proyecto web. Por ahora solo te mostraré cómo usarlo para servir JavaScript, HTML y CSS (pues no podemos procesar nada del lado del servidor). Así que, que quede claro: solo va a funcionar para las cosas del lado del cliente y no del lado del servidor sin importar el lenguaje de programación. Pero no te preocupes, para un portafolio o aplicación web funcionará de maravilla, siempre y cuando no utilice backend. ...
En este post te enseñaré a validar formularios HTML usando JavaScript nativo o JS puro, sin usar frameworks ni librerías externas. De este modo vas a poder comprobar si un formulario se envía dependiendo de los valores que el usuario haya colocado. Te enseñaré un ejemplo para que veas cómo validar un formulario en JavaScript apoyándote además de la validación nativa de HTML. Solo recuerda que la validación del lado del cliente se hace por mera decoración, y no por seguridad; ya que la seguridad se aplica en el lado del servidor. ...