Ich habe Zurb Foundation und Skeleton schon früher benutzt, also kenne ich beide, aber ich musste nie zuvor eine existierende Website in eine responsive Website umwandeln. Was ist die schnellste Methode, um meine Website zu konvertieren? Verwenden Sie ein Framework wie oben oder fügen Sie Media Queries für den bereits bereitgestellten Code hinzu? (Ist das überhaupt?)Schnellste Möglichkeit, um die Website ansprechend zu gestalten?
Bestimmen Sie, welche Geräte Sie unterstützen möchten und dann ein Stylesheet mit etwas in dieser Richtung hinzu:
/* =Responsive Structure
----------------------------------------------- */
@media (max-width: 800px) {
/* Smaller Resolution Desktops and Laptops */
[...]
}
@media (max-width: 650px) {
/* Smaller devices */
[...]
}
@media (max-width: 450px) {
/* Even Smaller devices */
[...]
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
/* Even Smaller devices */
[...]
}
Es ist am einfachsten zu testen, ob sie in absteigender Reihenfolge zu gehen. Weitere Beispiel Medienanfragen hier:
http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
danke! Es wäre also die einfachste Art, die Website responsiv zu machen. –
Ja, weil Sie es zu einem bestehenden Stylesheet hinzufügen können und sofort mit dem Überschreiben beginnen. –
Hast du das Joe gemacht? Was waren deine Ergebnisse? Ich bin dabei, das gleiche auf der Website eines Kunden zu tun, und ich versuche zu entscheiden, ob sie empfehlen, dass sie ihr CSS von Grund auf neu erstellen (was ein ziemlich großes Projekt ist), oder tun Sie es so. – vrutberg
In meinem Fall muss ich die Website von Grund auf neu zu schreiben, weil meine ansprechenden Stil Datei, um das Problem zu beheben nur knapp sein Ziel .. Also ich meine Styles umschreiben LESS verwenden und die ich schaffen ein responsives Stylesheet mit den richtigen Medienabfragen wie Matthew Darnell.
Ich bin nicht vertraut mit Skelett, aber Twitter Boostrap funktioniert gut für mich.
Wenn Sie bereit sind, ein bisschen Hirnarbeit und Migration zu machen, gibt es eine Möglichkeit, Foundation auf einem aktuell existierenden Projekt zu installieren (speziell bei Kompass-Projekten).
Zuerst muss der Kompass installiert sein und das Projekt in ein Kompassprojekt umgewandelt werden. Ein einfacher Weg, dies zu tun, ist via Code-Kit und ziehen Sie einfach Ihren Projektordner in den Code-Kit. Sie können einige Terminal-Hinweise über diese Seite auf der Website der Stiftung erhalten.
http://foundation.zurb.com/docs/sass.html
Sie würden dann Terminal zu öffnen brauchen und geben Sie
cd /path-to-your-project-folder/
dann
compass install -r zurb-foundation foundation
eingeben können Sie versuchen, und die Verwendung Fundament allein auf einer bestehenden Anwendung von vollständig sass mit (kein Kompass), aber du müsstest die Foundation von der Git-Site herunterladen und die scss einzeln hinzufügen. Sie finden Informationen auf der Seite, die ich oben aufgeführt habe.
Reagieren auf was? Sprechen Sie über Website-Performance? Sie verweisen auf Medienanfragen, die etwas anderes bedeuten. Ich denke wir haben uns verwirrt. Worum geht es eigentlich bei deiner Frage? – jfriend00
@ jfriend00, der Begriff "responsive", im Webdesign (und speziell "Responsive Design" pro Frage-Tags) bezieht sich auf Websites, die dynamisch ihr Layout mit CSS-Medienabfragen für jede Bildschirmgröße anpassen, auf der sie sich befinden. –