2016-12-28 1 views
-4

Ich verstehe, dass Bootstrap is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile-first web sites. So hilft es die Websites reagiert und so. Zur Zeit habe ich eine andere Datei für css, wo ich media queries verwende und mein CSS-Layout dadurch reorganisiere (das ist, wie ich es reaktionsfähig mache).ist Bootstrap 3 automatisch ansprechbar?

Behandelt Bootstrap alle Medienabfragen für mich, oder muss ich zusätzliche Arbeit leisten?

+1

Es tut mir leid, aber solche Frage bietet keine praktische oder spezifische Problem, sondern eher eine vage. Außerdem ist dies nicht unbedingt mit jQuery und Javascript verbunden, da Sie mehr über Medienabfragen erfahren. Wenn die wahre Frage ist: ** Muss ich mich um Medienabfragen kümmern? ** Die Antwort lautet ** Nein, solange Sie die Tools verwenden, die Ihnen der BoostRap ** gibt. In jedem Fall macht Bootstrap ** keine Magie für Ihr vorhandenes Projekt **, Sie müssen sein Grid-System verwenden und die Komponenten verwenden, die es Ihnen gibt. – briosheje

+0

Ja, ich habe generell nach mediaquerries gefragt –

+0

Es wird nicht automatisch Ihr _existing_-Layout reagieren, Sie müssen das Grid-System von Bootstrap verwenden, indem Sie die entsprechenden Klassennamen verwenden. –

Antwort

1

Das ist richtig, alle Medienabfragen werden von Bootstrap behandelt. Sie müssen nur die entsprechenden Klassen Ihren HTML-Elementen zuweisen.

Mehr Informationen über das Grid-System finden Sie hier: http://getbootstrap.com/css/#grid

Sie werden Ihre HTML müssen keine zusätzliche CSS-Änderungen vornehmen müssen, ändern für Bootstrap ‚out of the box‘ arbeiten

Bootstrap verwendet vier Gerätegrößen: XS, XM, MD und LG. Hier sind die Medienabfragen, die Bootstrap verwendet. Vielleicht möchten Sie vergleichen, um sicherzustellen, dass Ihr System in der Nähe von Theres ist. Andernfalls müssen Sie möglicherweise eine größere Überholung durchführen.

/* Extra small devices (phones, less than 768px) */ 
/* No media query since this is the default in Bootstrap */ 

/* Small devices (tablets, 768px and up) */ 
@media (min-width: @screen-sm-min) { ... } 

/* Medium devices (desktops, 992px and up) */ 
@media (min-width: @screen-md-min) { ... } 

/* Large devices (large desktops, 1200px and up) */ 
@media (min-width: @screen-lg-min) { ... } 
+0

Boostrap nicht alle Medienabfragen _handle_ eine allgemeine Reihe von Klassen, _component_, die je nach einer Reihe von _predefined_ Media-Abfragen anders formatiert sind. Die meisten größenbezogenen Werte (z.B. 'screen-md-min') können unter Verwendung einer Konfigurationsdatei und eines Sass- oder weniger Vorprozessors angepasst werden, um die Anforderungen des Projekts zu erfüllen. Es ist nicht ungewöhnlich, eigene mediaqueries mit eigenen Werten oder mit der Konfigurationsdatei hinzuzufügen, um Komponenten hinzuzufügen, die nicht im Bootstrap enthalten sind. –

+0

Ich würde mich zu unterscheiden. Die vordefinierten Medienabfragen von Bootstrap behandeln alle Gerätegrößen. Sie können Ihre eigenen Medienabfragen hinzufügen, müssen dies aber nicht tun. Da Bootstrap alle Medienabfragen behandelt. –

+0

Für ein Backend oder eine Webanwendung können Sie möglicherweise nur die Klassen und Komponenten verwenden, die von Bootstrap bereitgestellt werden, aber es ist noch wahrscheinlicher, dass Sie eigene Komponenten erstellen müssen, in denen Sie Medienabfragen definieren müssen, damit sie reagieren. Für gut aussehende Webseiten gibt es normalerweise keine Möglichkeit, definierte eigene Medienabfragen basierend auf den von Bootstrap bereitgestellten zu erstellen. –