Categoría: Bootstrap

¿Cómo configurar la clase activa en el menú de navegación desde el arranque?

Posted on by Rudeus Greyrat

Para establecer dinámicamente la clase activa en el menú de navegación desplazándose o haciendo clic en los enlaces de navegación, la clase activa debe establecerse en cada sección según la posición de la página web. Para agregar métodos y variables, se utiliza JavaScript. Para realizar alguna acción, las funciones se pueden llamar en algunos eventos, … Continue reading «¿Cómo configurar la clase activa en el menú de navegación desde el arranque?»

Grupo de lista Bootstrap 5

Posted on by Rudeus Greyrat

Bootstrap 5 es el último lanzamiento importante de Bootstrap en el que renovaron la interfaz de usuario y realizaron varios cambios. Los grupos de listas son un componente flexible y potente para mostrar una serie de contenidos. Estos se pueden modificar y ampliar para admitir casi cualquier contenido. Utilice las clases .list-group y .list-group-item para … Continue reading «Grupo de lista Bootstrap 5»

¿Cómo hacer filas desplazables verticales en bootstrap?

Posted on by Rudeus Greyrat

Aquí está la tarea de hacer desplazable verticalmente en una fila de arranque. Se puede hacer con el siguiente enfoque: Acercarse: Haciendo todo el elemento div en la siguiente línea usando position: absolute; propiedad (organizar todos los div en forma de columna). Agregando la barra de desplazamiento a todo el elemento div usando overflow-y: scroll; … Continue reading «¿Cómo hacer filas desplazables verticales en bootstrap?»

¿Cómo personalizar enlaces para paginación en Bootstrap?

Posted on by Rudeus Greyrat

En muchos sitios web, notamos que cuando buscamos algo, se muestra todo el contenido relacionado, pero si la cantidad de contenido es grande, el sitio web será más largo.  Para solucionar esto, hay paginación en la página web, es decir, los contenidos se dividen en muchas páginas y al hacer clic, el usuario puede navegar … Continue reading «¿Cómo personalizar enlaces para paginación en Bootstrap?»

¿Cómo hacer visible la casilla de verificación al pasar el mouse o seleccionar el elemento?

Posted on by Rudeus Greyrat

El problema aquí es cómo hacer que una casilla de verificación sea visible solo cuando: se cierne sobre Seleccionado Enfoque: la casilla de verificación no debe estar visible cuando no está seleccionada. Solo se vuelve visible cuando se pasa el cursor por encima de nuevo. La solución al problema es simple. Podemos usar la propiedad … Continue reading «¿Cómo hacer visible la casilla de verificación al pasar el mouse o seleccionar el elemento?»

¿Cómo hacer que el botón plegable aparezca solo en la vista móvil usando Bootstrap?

Posted on by Rudeus Greyrat

El botón plegable se utiliza para ocultar o mostrar la lista de contenidos al hacer clic en el botón. Al hacer clic en el botón plegable, se expande y muestra una lista de contenidos para seleccionar, que luego se asigna a un contenido específico. El botón plegable en la vista móvil aparece solo en la … Continue reading «¿Cómo hacer que el botón plegable aparezca solo en la vista móvil usando Bootstrap?»

Arranque 4 | Modal

Posted on by Rudeus Greyrat

En palabras simples, el componente modal es un cuadro de diálogo/ventana emergente que se muestra en la parte superior de la página actual, una vez que se hace clic en el botón de activación. Sin embargo, al hacer clic en el fondo del modal se cierra automáticamente el modal. Además, debe tenerse en cuenta que … Continue reading «Arranque 4 | Modal»

Creando Responsive Grid Vanilla usando HTML, CSS y Bootstrap

Posted on by Rudeus Greyrat

Muchos sitios web modernos utilizan un sistema de cuadrícula para mostrar fragmentos de datos en su página de inicio y en otras páginas. En gran medida, la cuadrícula se asemeja a una mesa, sin embargo, es mucho más atractiva visualmente y, con mayor frecuencia, muestra elementos hermanos. Una grilla debe ser responsive, es decir, debe … Continue reading «Creando Responsive Grid Vanilla usando HTML, CSS y Bootstrap»

¿Cómo colocar dos cuadros de entrada uno al lado del otro usando Bootstrap 4?

Posted on by Rudeus Greyrat

En este artículo, aprenderemos cómo tomar dos entradas en una sola línea en HTML. HTML admite varios tipos de entradas como texto, contraseña, fecha y hora, fecha, hora, semana, número, correo electrónico y mucho más. Hay varias condiciones en las que tenemos que tomar múltiples entradas en una sola línea o una al lado de … Continue reading «¿Cómo colocar dos cuadros de entrada uno al lado del otro usando Bootstrap 4?»