116 votos

Brújula vs Twitter Bootstrap

Voy a comenzar una nueva rieles web app y después de días de investigación en css marcos, decidió ir con Brújula y 960.gs/Modelo. Pero ahora Twitter ACABA de salir con Bootstrap y tengo que decir que se ve realmente agradable.

Sé que la Brújula está del lado del servidor compilado mientras Bootstrap (que se basa en less.js) se maneja en el lado del cliente y también se requiere de JS, Pero...¿qué web app no?

Lo que me gusta de Bootstrap está todo listo para ir a características como la fija superior de navegación y se ordenan en tablas y estilo. Hay una manera de conseguir el mismo a través de la Brújula?

295voto

Alejandro Iglesias Puntos 7779

Brújula y Bootstrap no son el mismo tipo de cosa. La brújula es una hoja de estilos marco construido en la parte superior de SASS.

Así que, ¿qué SASS?

SASS es un "preprocesador CSS" como MENOS. Ampliar el lenguaje CSS proporciona más flexibilidad y, lo que es realmente poderoso.

Bootstrap

Bootstrap es un (digamos) "stylesheet andamio" que tiene una cuadrícula (similar a la de [960.gs]), algunos de andamio de estilos y un par de buenas widgets. Tiene similitudes con la Modelo debido a que el último también tiene una cuadrícula, andamio de estilos, etc. La cosa agradable sobre Bootstrap es que tiene un par de buenas widgets, como el Topmenu de Navegación, cuadros de diálogo modales, etc. (aquellos que requieren de un poco de JavaScript que depende de jQuery o de Ender Ender eliminar la compatibilidad en v2) y está construida en la cima de MENOS. Eso es una gran ventaja para arrancar más de Anteproyecto. Voy a dejar de mencionar 960.gs ser que es sólo una rejilla, no que mucho más útil para mí.

Entonces, ¿qué es todo esto?

Bootstrap = Blueprint (redes, andamios estilos)

SASS = MENOS (preprocesadores de CSS)

Brújula != Bootstrap

Brújula Marco

El único marco aquí, desde mi punto de vista es la Brújula porque realmente sugiere un marco para trabajar, viene con el Modelo de la cuadrícula y el de niza, tiene un bonito paquete de mixins ya para usted, para CSS3, tipografía, etc, etc. Quiero radio frontera? Derecha: .my-button { @include border-radius; } ¿Qué? Gradiente de fondo? Aceptar: .my-button { @include linear-gradient(color-stops(white, black)); }. ¿Qué? Quiere que todo esto cross-browser? Sí, todo esto es cross-browser.

El proyecto sistema de la red está incluido como plug-in en la Brújula y, como @corroído, dijo, no es un Bootstrap plugin para Compass así como hay un 960.gs plugin para Brújula.

Conclusión

Yo diría que ir y probar muchos de ellos y ver qué funciona mejor para usted. Actualmente estoy trabajando con Brújula con Blueprint. La brújula es un gran marco y Modelo viene con ella (y es el sistema de la red que estaba usando antes de la Brújula). Me gustan estas herramientas demasiado.

Actualización: actualmente estoy trabajando en un proyecto con el Bootstrap y MENOS y funciona muy bien! Desde mi punto de vista, SASS es más poderoso que MENOS, pero MENOS tiene less.js, un script que analiza sus hojas de estilo sobre la marcha, desde el navegador, basta con editar y actualizar. Cuando termine su desarrollo, compilación de CSS. No compilador ejecuta en la consola. Por otro lado, echo de menos la Brújula' poderoso incluido mixins, tengo que codificar todo ahora. Lo siguiente que voy a probar es el Bootstrap plugin para Compass, parece como una poderosa combinación! También, Vivir de Recarga, CodeKit, Scout y (para los amantes de la consola entre nosotros) Gruñido hacer la compilación sobre la marcha posible para MENOS, SASS/Compass (y más).

Actualización: Aquí está una comparación de Sass y Menos código.

Actualización: Excelente artículo acerca de SASS versus MENOS de comparación. Debe comprobarlo.

22voto

corroded Puntos 9116

Para obtener lo mejor de ambos mundos, el uso de twitter bootstrap brújula plugin:

https://github.com/vwall/compass-twitter-bootstrap

EDITAR SASS parece compatible oficialmente con esto también:

http://thesassway.com/projects/sass-twitter-bootstrap

como ya se ha comentado por Jo Liss

8voto

Bobby Puntos 89

Me gustaría ver en Twitter Bootstrap en IE 6, 7, 8, y 9 antes de usar. Parece que tiene algunos problemas de compatibilidad.

4voto

rogelio Puntos 41

Hay un puerto de bootstrap de Twitter para SASS en sass-twitter bootstrap

2voto

Jamie Carruthers Puntos 350

Yo he comprobado en IE9 y todo se ve bien.

Mi única preocupación es la cantidad de marcado que se requiere para los campos de formulario.

    <div class="clearfix">
        <label for="">X-Large Input</label>
        <div class="input">
          <input class="xlarge" id="xlInput" name="xlInput" size="30" type="text">
        </div>
     </div>

Eso es un montón de etiquetas para un campo de formulario.

Aparte de eso, me gusta. Es genial tener un framework CSS con cuadrícula y la tipografía, pero también buena pinta formularios, tablas y botones. Creo que definitivamente voy a estar usando la misma para mi próximo proyecto.

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by:

X