Ir al contenido principal

Cómo usar bootstrap en html y no volverte loco

Hola de nuevo, esto es fácil pero como todo hasta que no lo haces por lo menos una vez hay que mirarlo.

Lo más fácil imposible

Como he visto que esto puede serte de mucha utilidad he creado solo para ti un proyecto preconfigurado. Esto quiere decir que boostrap ya esta listo para funcionar sin que hagas nada y desde el minuto 1. Te lo puedes descargar desde aquí https://ifelse.es/vistas/recursos.html

Lo mínimo

Para configurar un proyecto Bootstrap lo primero que tenemos que hacer es descargarlo, para ello vamos a https://getbootstrap.com/ y pulsamos en download.

Si descomprimimos el proyecto nos generara dos carpetas, css y js. Teniendo esto en mente, nuestro documento .html debería quedarnos enlazado de la siguiente manera.


Con esto ya te debería estar funcionando el asunto.

Lo profesional

Algunas utilidades de Boostrap utilizan Jquery, así que lo enlazaremos también. Para ello nos descargamos Jquery dirigiéndonos a https://jquery.com/ y pinchando en download. Deberemos elegir la versión "Download the compressed, production jQuery Número.Número.Número". Se os abrirá todo el código en una nueva pestaña, son así de gañanes, aunque esto tiene su justificación dado que se puede enlazar directamente con esa url pero bueno. Yo soy siempre partidario de tenerlo descargado así que click derecho, guarda como y a la carpeta "js" del boostrap.

Ahora el proyecto nos debería de quedar de la siguiente manera.


Los numeritos del jquery evidentemente a ti te variarán porque de seguro que te descargarás una versión más actual respecto a al fecha de publicación de este artículo. Copia y pega el nombre del archivo y fuera.

un saludo colegui, pásalo bien y espero que ya lo tengas funcionando.

Comentarios

Entradas populares de este blog

Cómo hacer scroll suave o smooth scroll en javascript y css

Seguro que alguna vez te has preguntado como conseguir el efecto de scroll suave o también conocido como smooth scroll. Esto significa que cuando haces un enlace dentro de la propia página. Al pinchar no salte de golpe, sino que vaya a la ubicación correspondiente de manera suave. Para este propósito tenemos dos opciones: Sencilla En mi página web dentro del curso básico de html ( ver curso de ifelse.es ) lo tengo programado de la siguiente manera y me funciona bastante bien. Para verlo en acción, accede a la página de mi curso de html básico y pincha en el menú de la izquierda en la opción de párrafos. html { scroll-behavior: smooth; -webkit-overflow-scrolling: touch; } Más compleja Otra opción es utilizando la librería scroll-smooth para ello debes añadir los siguientes fragmentos antes de la última etique body de vuestro html. Esta librería tiene muchas opciones así que no estaría mal que le echases un ojo a la documentación.Te vuelvo a dejar el enlace ...

Crear instancias Mysql MariaDB Ubuntu Server

Seguro que te has visto en la necesidad de tener más de un MariaDB, o base de datos basada MySql, para poder trabajar en diferente proyectos de desarrollo simultáneamente y tener las bases de datos completamente independientes. Para ello, la mejor solución es crear diferentes instancias. He creado esta guía paso a paso que os servirá tanto para MariaDB como otras bases de datos basadas en MySql desplegadas en Ubuntu Server. En esta guía vamos a montar dos instancias de MariaDB, una en el puerto 3308 y otra en el 3309. Recordad que el puerto por defecto es 3306 por tanto no montéis una instancia en ese puerto dado que en caso contrario creará conflicto con la instancia instalada por defecto que se crea al instalar MariaDB. Privilegios de superuser Lo primero que deberemos hacer es conseguir privilegios de administrados. Para ello teclearemos el siguiente comando: $sudo su $(meteréis vuestra contraseña y enter) #(ahora estaréis como superusuario) Detener servicio mysql L...

Algoritmo de ordenación de datos tipo bubble o burbuja

En la ciencia de la computación existen varios estándares de algoritmos para ordenar un conjunto de datos. En la práctica arrays. El primer método de ordenación que se utilizó es es el de tipo “bubble” o burbuja. Este método es el que más se asemeja a la forma de ordenar humana. Y funciona de la siguiente manera. Supongamos que tenemos la siguiente lista de números y los queremos ordenar de mayor a menor. Números= [1,2,4,8,9] Ahora este algoritmo compara el número en el que estamos con el siguiente. Si es mayor no hace nada, si es menor intercambia las posiciones de los números. El algoritmo empezaría por la posición cero que corresponde al número 1. Iteración 0 : [2,1,4,8,9] Iteración 1 : [2,4,1,8,9] Iteración 2 : [2,4,8,1,9] Iteración 3 : [2,4,8,9,1] Iteración 4 : [4,2,8,9,1] Iteración 5 : [4,8,2,9,1] Iteración 6 : [4,8,9,2,1] Iteración 7 : [8,4,9,2,1] Iteración 8 : [8,9,4,2,1] Iteración 9 : [9,8,4,2,1] El array ya está ordenado, el bucle hará ...