iPad Browser WIDTH & amp; HÖHEN Standard

Kennt jemand die sicherste Breite und Höhe für den KÖRPER bei der Anzeige einer Webseite auf dem iPad? Ich möchte vermeiden, die scrollbars so viel wie möglich.

Dank.

Erik

InformationsquelleAutor der Frage Erik | 2010-07-30

  1. 272

    Die pixel-Breite und Höhe der Seite wird davon abhängen, Orientierung sowie der meta-viewport-tag, wenn angegeben. Hier sind die Ergebnisse der Ausführung von jquery ' s $(window).width() und $(window).Höhe() auf iPad 1 browser.

    Wenn die Seite hat keine meta-viewport-tag:

    • Portrait: 980x1208
    • Landschaft: 980x661

    Wenn Seite hat diese beiden meta-tags:

    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">

    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1">

    • Portrait: 768x946
    • Landschaft: 1024x690

    Mit <meta name="viewport" content="width=device-width">:

    • Portrait: 768x946
    • Landschaft: 768x518

    Mit <meta name="viewport" content="height=device-height">:

    • Portrait: 980x1024
    • Landschaft: 980x1024

    Mit <meta name="viewport" content="height=device-height,width=device-width">:

    • Hochformat: 768 x 1024
    • Querformat: 768 x 1024

    Mit <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width,height=device-height">

    • Hochformat: 768 x 1024
    • Landschaft: 1024x1024

    Mit <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,height=device-height">

    • Portrait: 831x1024
    • Landschaft: 1520x1024

    InformationsquelleAutor der Antwort Paul Rademacher

  2. 13

    Gibt es keine einfache Antwort auf diese Frage. Apples mobile version von WebKit, verwendet in iPhones, iPod Touches, und iPads, wird die Skalierung der Seite auf den Bildschirm passen, und der Benutzer kann zoom in und out frei.

    Das heißt, Sie können das design Ihrer Seite minimieren von Zoomen notwendig. Ihre beste Wette ist, um die Breite und Höhe die gleiche wie die niedrigere Auflösung des iPad, da Sie nicht wissen, welche Art es ist-orientiert; mit anderen Worten, Sie würden Ihre Seite 768x768, so dass es passt gut auf dem iPad-Bildschirm, ob es ausgerichtet werden 1024 x 768 oder 768 x 1024.

    Wichtiger ist, würden Sie wollen, entwerfen Sie Ihre Seite mit großen steuert-mit viel Platz, die sind einfach zu treffen mit den Daumen - Sie könnte leicht design eine 768x768 Seite war sehr unübersichtlich und daher benötigt viel Zoomen. Um dies zu erreichen, werden Sie wahrscheinlich wollen, teilen Sie Ihre Steuerelemente unter einer Reihe von web-Seiten.

    Auf der anderen Seite, es ist nicht die meisten lohnt sich die Verfolgung auf. Wenn während der Gestaltung, finden Sie Möglichkeiten, um Ihre Seite besser "finger-freundlich" ist, dann go for it...aber die Realität ist, dass iPad-Nutzer sind sehr komfortabel und mit bewegen und Zoomen in und aus der Seite zu Holen, um Dinge, denn es ist notwendig, auf den meisten web-sites. Wenn überhaupt, werden Sie wahrscheinlich wollen, um es zu designen, so dass es förderlich für diese Art der navigation.

    Boxen machen mit den relevanten Daten gruppiert werden können, leicht doppelt angetippt, um den Fokus auf, und halten Sie die entsprechenden Steuerelemente dicht beieinander. iPad-Nutzer werden wahrscheinlich schätzen einen Seite erleichtert, dass die bekannte zoom-und-Schwenk-navigation Sie sind daran gewöhnt, mehr als eine Seite mit weniger Kontrollen, so dass Sie nicht haben, um.

    InformationsquelleAutor der Antwort macamatic

  3. 0

    Können Sie versuchen, diese:

        /*iPad landscape oriented styles */

    @media only screen and (device-width:768px)and (orientation:landscape){
        .yourstyle{

        }

    }

    /*iPad Portrait oriented styles */

    @media only screen and (device-width:768px)and (orientation:portrait){
        .yourstyle{

        }
    }

    InformationsquelleAutor der Antwort José Moreira de Freitas Junior

Schreibe einen Kommentar