Es común tener conflictos CSS cuando se utiliza un bootstrap. dentro de una página existente con otros estilos ya definidos.
Puedes aislar tu CSS bootstrap para que actúe desde un DIV específico, como en el ejemplo de abajo:
<div class="bootstrap-iso"> <!-- A partir daqui sua página será estilizada com seu Bootstrap CSS --> </div>
¿Cómo aislar mi CSS de bootstrap?
- Instale Node.JS en su ordenador: http://nodejs.org/
- Ahora vamos a instalar un procesador CSS que hará el aislamiento:
npm install -g less
- Crea un directorio vacío y copia en él los archivos CSS de boostrap:
- Dentro de este directorio añada el archivo «prefix.less» con el siguiente contenido
.bootstrap-iso {
@import (less) 'bootstrap.css';
}
Cada línea corresponde a su archivo boostrap que será aislado.
- Abra CMD (Windows) o Terminal (Linux), vaya al directorio creado anteriormente y ejecute el siguiente comando:
lessc prefix.less bootstrap-iso.css
Se ha generado un nuevo archivo CSS, «boostrap-iso.css».
Ahora todo lo que tienes que hacer es incluir este archivo en tu página y añadir la class=»bootstrap-iso» al DIV al que quieras aplicar el bootstrap.
