Cómo utilizar Twitter Bootstrap 3 para el sitio no sensible? [duplicar]
Esta pregunta ya tiene una respuesta aquí:
Como puedes leer en su página, el nuevo Bootstrap 3 es "mobile first":
Con Bootstrap 2, agregamos estilos opcionales compatibles con dispositivos móviles para key aspectos del marco. Con Bootstrap 3, hemos reescrito el el proyecto será compatible con dispositivos móviles desde el principio. En lugar de añadir estilos móviles opcionales, se cuecen directamente en el núcleo. En de hecho, Bootstrap es móvil primero. Se pueden encontrar los estilos Mobile first a lo largo de toda la biblioteca en lugar de en archivos separados.
¿Cómo puedo desactivar la capacidad de respuesta? Quiero que mi sitio no se reorganice para tableta o móvil.
6 answers
Para un procedimiento más explicado ver Cómo usar Twitter Bootstrap 3 para el sitio no responsivo
De Documentación de Bootstrap (más algunas explicaciones):
Para desactivar las funciones de respuesta, sigue estos pasos. Véalo en acción en la plantilla modificada a continuación.
1) Eliminar (o simplemente no agregar) la ventana
<meta>mencionado en los documentos CSS
Se explica por sí mismo
2) Eliminar el ancho máximo en las
.containerpara todos los niveles de cuadrícula con max-width: ninguno !importante; y establecer un ancho regular como ancho: 970px;. Asegúrese de que esto viene después del CSS de Bootstrap predeterminado. Usted opcionalmente puede evitar el !importante con consultas de medios o algunos selector-fu.
Añade este estilo:
.container{
max-width: none !important;
width: 970px;
}
3) Si usa barras de navegación, deshaga todas las barras de navegación que se contraen y expanden comportamiento(esto es demasiado para mostrar aquí, así que mira el ejemplo).
Abierto variables.less y establecer las variables:
@grid-float-breakpoint a 0
@screen-xs-max a 0 (esto será corregido; leer aquí)
4) Para los diseños de cuadrícula, hacer uso de .col-xs - * clases además de o en lugar de los medianos / grandes. No te preocupes, el dispositivo extra pequeño la cuadrícula escala hasta todas las resoluciones, por lo que está configurado allí.
Se explica por sí mismo
Usted todavía tendrá que Responder.js para IE8 (ya que nuestras consultas de medios son todavía allí y necesita ser recogido). Esto solo deshabilita el " móvil sitio" de Bootstrap.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:10:36
Sin modificaciones importantes a la fuente, simplemente no parece posible.
El siguiente enlace detalla los cambios necesarios: http://bassjobsen.weblogs.fm/compile-twitters-bootstrap-3-without-responsive-features /
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-08-17 03:48:09
Los documentos de Bootstrap 3 en realidad contienen un párrafo para este problema: http://getbootstrap.com/getting-started/#disable-responsive
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-08-20 14:30:41
Bueno, yo estaba buscando lo mismo. Todavía no lo he comprobado, así que no puedo dar fe de su funcionalidad, pero aquí hay una versión con respuesta tomada:
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-08-01 19:41:57
Echa un vistazo a la respuesta aquí de Jay Douglass que detalla la anulación de las variables de punto de interrupción de media query para desactivar las características de respuesta. Es una solución simple que requiere un cambio mínimo.
Cómo eliminar las funciones de respuesta en Twitter Bootstrap 3?
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:18:07
Con un pequeño esfuerzo puedes lograr eso.
1) Eliminar viewport
2) Añade .container{ max-width: none !important; width: 970px; } a tu archivo css
3) Si usa barras de navegación, deshaga todo el comportamiento de colapso y expansión de la barra de navegación
4)
Para los diseños de cuadrícula, haga uso de .clases col-xs-* además de o en lugar de los medianos / grandes. No te preocupes, el dispositivo extra pequeño la cuadrícula escala hasta todas las resoluciones, por lo que está configurado allí.
Puede seguir el enlace abajo:
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-09-20 08:25:02