Come utilizzare Twitter Bootstrap 3 per siti non responsive?

Question

Come si può leggere sulla loro pagina, la nuova Bootstrap 3 è "mobile in primo luogo":

Con Bootstrap 2, abbiamo aggiunto stili amichevoli mobili opzionali per chiave aspetti del quadro. Con Bootstrap 3, il progetto è stato riscritto fin dall'inizio. Anziché aggiungere gli stili mobili opzionali , sono integrati nel core. Nel fatto , Bootstrap è mobile per primo. I primi stili mobili possono essere trovati in tutta la libreria invece che in file separati.

Come disattivare la risposta? Voglio che il mio sito non si riorganizzi per tablet o mobile.

Answer 1

Per una più spiegato procedura di vedere How to use Twitter Bootstrap 3 for non-responsive site

Da Bootstrap documentation (più alcune spiegazioni):

Per disabilitare le funzionalità di risposta, attenersi alla seguente procedura. Guardalo in azione nel modello modificato di seguito.

1) Rimuovi (o semplicemente non aggiungere) la finestra <meta> menzionati nella documentazione CSS

auto-esplicativo

2) Rimuovere il max-width sul .container per tutti i livelli di rete con larghezza massima: nessuno! Importante; e impostare una larghezza come larghezza regolare: 970px ;. Assicurati che questo avvenga dopo il Bootstrap CSS predefinito. L'utente può facoltativamente evitare l'importante! Con le query multimediali o un altro selettore-fu .

Aggiungere questo stile:

.container{ 
    max-width: none !important; 
    width: 970px; 
} 

3) Se si utilizza navbars, annullare tutto la barra di navigazione comprimere ed espandere comportamento (questo è troppo per mostrare qui, in modo da sbirciare l'esempio) .

Apri variables.less e impostare le variabili:

@grid-float-breakpoint a 0

@screen-xs-max a 0 (questo sarà fissato; leggere here)

4) Per Layout griglia, make uso di .col-xs- * classi in aggiunta o in posizione di quelli medio/grandi. Non ti preoccupare, la griglia del dispositivo extra-piccolo scala fino a tutte le risoluzioni, quindi sei lì.

auto-esplicativo

Avrai ancora bisogno Respond.js per IE8 (dal momento che le nostre domande dei media sono ancora lì e devono essere ritirati). Questo semplicemente disabilita il "mobile sito" di Bootstrap.

Answer 2

Senza le principali modifiche alla sorgente, non sembra possibile. Dettagli

Il seguente link le modifiche necessarie: http://bassjobsen.weblogs.fm/compile-twitters-bootstrap-3-without-responsive-features/

Answer 3

Beh, stavo cercando la stessa cosa. Non ho ancora controllato fuori, quindi non posso attestare che è la funzionalità, ma qui è una versione con reattivo tolto:

https://github.com/bassjobsen/non-responsive-tb3

Answer 4

Partenza qui la risposta di Jay Douglass che dettaglia sovrascrivendo il variabili di breakpoint della query multimediale per disabilitare le funzionalità reattive. È una soluzione semplice che richiede un minimo cambiamento.

How to remove responsive features in Twitter Bootstrap 3?

Answer 5

I Bootstrap 3 docs in realtà contengono un paragrafo di questo problema: http://getbootstrap.com/getting-started/#disable-responsive

Answer 6

Con un piccolo sforzo è possibile ottenere quello.

1) Rimuovere finestra

2) Aggiungere .container{ max-width: none !important; width: 970px; } al file css

3) Se si utilizza navbars, annullare tutte le barra di navigazione comprimere ed espandere il comportamento

4)

Per i layout di griglia, utilizzare le classi .col-xs- * in aggiunta o in posizione di medie/grandi dimensioni. Non ti preoccupare, la griglia del dispositivo extra-piccolo scala fino a tutte le risoluzioni, quindi sei lì.

È possibile seguire il link qui sotto:

http://getbootstrap.com/getting-started/#disable-responsive