Tag: media-queries
Media queries ermöglichen die bedingte Anwendung von CSS-Stilen auf der Basis von Medientypen wie screen und print, und die Bedingungen des media-features, wie der viewport und Gerät in Höhe und Breite. Sie sind Teil des W3C CSS3-Spezifikation.
Respond.js für CSS3 Media Queries
1 Antworten
Ich versuche zu verwenden Respond.js für CSS3 Media Queries auf älteren IE-Versionen https://github.com/scottjehl/Respond Bin ich immer etwas Meldung "Zugriff verweigert" in Javascript. Habe ich versucht ähnlich http://scottjehl.github.com/Respond/cross-domain/example.html Ich denke, es gibt einige cross-domain-setup zu tun...Aber ich bin
media queries / be-verschiedene Bild-je nach Bildschirm-Größe
3 Antworten
Könnte dies einfach, aber ich bin verloren in all den Lösungen habe ich es geschafft, zu finden auf der web. Ich habe eine laufende website (www.webstalab.com) basierend auf Twitter Bootstrap-3, aber das Bild (mit zwei Statuen halten
Wie, um sicherzustellen, dass eine website füllt den gesamten viewport? (desktop, mobile, ipad, etc.)
3 Antworten
Wir haben derzeit eine website, die nicht von Flüssigkeit/flexibel (wie es ändert sich nicht das layout abhängig von der viewport-Größe). Wenn es auf dem desktop angezeigt, füllt es den gesamten Bildschirm (und zentriert ausgerichtet). Aber Problem entsteht,
Kann style "display: block" überstimmen "display: none" Medien print-CSS?
1 Antworten
Hier ist ein HTML-element: <div id="cboxOverlay" style="display: block; opacity: 0.9; cursor: pointer;" class="price_match_no_print"></div> Hier einige CSS: @media print { .price_match_no_print { display:none; } } Wenn ich nun drucken Sie die Seite aus, die oben genannten HTML-element kommt
CSS Media Queries Funktioniert Nicht auf Mobilen
2 Antworten
Behalte ich es concise.. Mit Zurb Foundation 5 um eine Website zu bauen. Media Queries funktionieren nicht. Code ist wie folgt: <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>...</title> <link rel="stylesheet" href="css/foundation.css" /> <link rel="stylesheet"
Gibt es eine Möglichkeit zum deaktivieren von media queries unter bestimmten Bedingungen?
3 Antworten
Ich bin mit dem gleichen stylesheet für die Haupt-Website, sowie eine "Vorschau" der Seite (NICHT in einem iframe, weil ich es brauche interaktiv). Die Fragen, die Vorschau nicht bis 100% der Bildschirmbreite, so dass, wenn media queries
visible-xs-block funktioniert nicht
1 Antworten
ich bin erstellen einer Website mit bootstrap, und ich möchte einige div-Karte nur in extra kleine Geräte, ich bin mit der visible-xs-block Klasse im div, aber nicht arbeiten. Einige jetzt, warum nicht? dies ist mein code: <div
Warum ist mein Android-device-width 980px?
3 Antworten
Ich bin verwirrt. Ich bin versucht, eine website zu machen reaktionsschnell Weg durch das Spiel mit media queries. laut den meisten Quellen, zum Beispiel diese, das mediq-Abfrage für smartphones ist max-device-width: 480px und min-device-width: 320px. Aber wenn
Modernizr Media query funktioniert nicht, wenn die Größe browser
2 Antworten
Benutze ich ein Modernizr media query in JavaScript zu ändern, ein element margin und fügen Sie eine Klasse "kleiner". Meine Modernizr media query funktioniert nicht, wenn ich die Größe in meinem browser, aber wenn ich die Seite
CSS responsive design mobile funktioniert nicht auf uc browser und opera mini
2 Antworten
Responsive website auf der UC-und Opern-min-browser funktioniert nicht richtig(wir verwendeten media query für "responsive design"). ich suchte herum, fand ich einige links: css responsive design mobile funktioniert nicht responsive website-design funktioniert nicht auf dem Handy aber keinen
CSS-Media-Query - Gerät Breite - portrait vs Landschaft
2 Antworten
Habe ich folgende Zweifel: 1) Hat die device-width, dass ein media-query entspricht, ändern sich je nach Modus (hochformat vs Querformat)? 2) herkömmliche laptops und desktops, jemals mit portrait-Modus? Ist die Orientierung zufällig/nicht definiert für Geräte, die nicht
display none verringert es die Ladezeit, oder sind die Elemente noch geladen, aber nicht angezeigt
3 Antworten
Baue ich eine responsive website mit media queries. Ich brauche zum Umschalten auf ein anderes navigation-Methode für sehr kleine Bildschirme. Für desktop - /tablet-screens, ich bin mit einem sprite-basierte UL/LI Liste-Methode. Für kleine Smartphone-Bildschirme, ich habe einfach
Media query zu unterscheiden desktop vom iPad im landscape-Modus
1 Antworten
Ich Baue eine website mit responsive design. Ich muss unterscheiden layout zwischen tablet im landscape-Modus und desktop-Computer mit media queries. Dies sind die media queries jetzt: <link href="base.css" rel="stylesheet"/> <link href="desktop.css" media="only screen and (min-width: 801px)" rel="stylesheet"/>
Webkit-float und display
1 Antworten
Ich habe ein problem mit Webkit-Browsern (Chrome/Safari), CSS3 Media Queries, display und float auf meine Website. Die Standard-styling auf meiner Webseite ist auf float das element nav rechts und display:inline-block. Wenn das Fenster in der Größe verändert,
Css-id ' s ändern sich nicht, auf media queries
2 Antworten
Meine Medien Abfrage nicht aktualisiert wird, richtig. Hier ist das test-html: <!DOCTYPE HTML> <html> <head> <link rel="stylesheet" type="text/css" href="main.css"> <title>Test </title> </head> <body> <div class="row"> <div id="verde" class="col-5"> <h2>Lorem Site</h2> <h3>Test Site</h3> </div> </div> <div class="row"> <div
WENIGER kompilieren Fehler
1 Antworten
Ich bin mit Incident57 ist CodeKit pre-Prozessor zu kompilieren eine Reihe von weniger-Dateien, die Sie importiert und minified in einer einzigen CSS-Datei namens Vorlage.css. Aber nach etwas editieren (und ich habe keine Ahnung was Bearbeiten verursacht diese)
Media queries nicht unterstützen 1024x768-system Auflösung
1 Antworten
ich habe hintergrund Farbe:Grau, für tablet, und der Farbe blau für mein system browser mit der Verwendung von media-queries css. Es ist in Ordnung. Das problem ist jetzt, wenn ich strukturierte meine system-Auflösung auf 1024x768, das Tablett,
tablet-Ausrichtung zu ändern mit jquery und modernizr
1 Antworten
Also ich habe ein nav-Menü, das ändert den Stil beim anzeigen von tablets im hoch-oder Querformat. Es klappt die letzten Menüpunkte in einem weiteren drop-down-Menü. Doch das Menü wird nicht aktualisiert nach Orientierung ändern, tun nur so,
CSS Größe für retina-Bilder
1 Antworten
Ich habe ein design für eine website, aufgeteilt in drei psd-Dateien: eine für desktop, eine für Tablets, eine für Smartphones. Ich mache alles responsive mit media queries und alles macht retina auch. Eine Sache, die mich stört
Media queries mit rem-Einheiten in Chrom?
3 Antworten
Ist es möglich rem Einheiten in Chrom media queries? rem Geräte arbeiten einwandfrei in Chrome, es scheint nur, dass Sie nicht unterstützt Medien-Anfragen. Ist das möglich? Oder ist es etwas anderes falsch mit diesem CSS? body {
Wie um zu verhindern, dass mobile Geräte, um die Größe und die Verwendung der richtigen css-Datei
2 Antworten
um zu verhindern, dass das horizontale scrollen in meinen web-Seiten habe ich 3 verschiedene stylesheets für mobile, tablet und desktop-Geräten. Ich versuche, um dem browser mitzuteilen, um die richtige css-Datei mit dem folgenden tags im Kopf der
Die Erkennung von iPad / iPhone mithilfe von media queries
3 Antworten
Arbeite an einem Projekt, wo ich zu unterscheiden zwischen dem landscape-und portrait-Modi für das iPhone, das iPad mit media queries. Auch, bin mit iPad 3, iPhone 4s. So einfach und unkompliziert, wie das klingt, ich bin habend
CSS Media Queries
3 Antworten
Ich versuche mich anzupassen, meine tablet-web-app für den Einsatz auf Handys. Die Media-Query-Funktionalität scheint perfekt und meine ersten Tests bestätigt. Die Frage die ich habe ist: mit Handys und tablets, ändern Sie die Orientierung von hochformat auf
HTML5 Boilerplate + Media Queries funktioniert nicht in IE8?
5 Antworten
Seit Boilerplate hat respond.js built-in, es sollte in der Theorie in der Lage sein, um Unterstützung folgende css: @media only screen and (max-height: 580px){.rnd-class{:height:200px !important;}} In FF und Chrome funktioniert es wie erwartet und die custom styles
Wie kann ich die Verwendung von @media-Abfragen in PHP?
4 Antworten
Ich versuche, fügen Sie ein Breite-responsive element, um eine client-Seite. Die Webseite wurde in PHP geschrieben, die ich bin nicht vertraut mit. Ich glaube, er ist auch mit WordPress (was ich bin auch nicht vertraut mit). Den
media query für galaxy s2
5 Antworten
Entwickelt ich ein responsive theme für meine website, Durch die Verwendung von media queries auf meine css-Datei. es funktioniert gut auf ipad/iphone und kleines android-Handys. Wenn ich zum galaxy S2 scheint es zu ignorieren, mein media queries.
Min-height auto ignoriert, in iOS
1 Antworten
Ich habe einige Liste mit items, die min-height: 12em - für desktop Wenn down-sizing für tablet /mobile Bildschirme, die ich zurücksetzen will dies: min-height: auto Jedoch iPad /iPhone ist das ignorieren dieser und pflegt die 12em Habe
Firefox bestimmte media queries
2 Antworten
Dies ist wahrscheinlich eine SEHR einfache Frage, aber ich habe eine harte Zeit! Ich habe eine externe CSS-Datei, die wunderbar funktioniert und ist ansprechbar. Wie zu erwarten, die Positionierung von ein paar Elementen ist ein wenig "off",
So laden verschiedene css-Datei je nach Fensterbreite: kleinere Größe nicht erkannt
1 Antworten
Ich laden soll eine andere css-Datei, wenn die Größe des Fensters unter 500 Pixel. Ich habe <link type="text/css" media='(max-width: 500px)' rel="stylesheet" href="/static/mobile.css" /> <link type="text/css" media='(min-width: 500px)' rel='stylesheet' href='/static/main.css' /> Aber die wichtigsten.css überschreibt immer die mobile.css
Optional ist die Ausführung von Javascript auf Basis von Media Queries
4 Antworten
Ich versuche, herauszufinden, wie kann ich Optional führen Sie einen block von javascript-basierend auf dem aktuellen Gerät/Medien-Abfrage. Ich bin mit Twitter Bootstrap und haben im wesentlichen zwei Versionen von media queries: @media (min-width: 980px) { ... }
Media queries funktioniert nicht
2 Antworten
Weiß jemand, warum mein media queries code nicht funktioniert ? <div class="box"></div> .box { background-color: red; width: 100%; height: 50px; } @media only screen and (max-device-width: 768px) { .box {border: 5px solid blue;} } http://jsfiddle.net/N9mYU/ InformationsquelleAutor user2013488
Mehrere Medien-Anfragen: max-width oder max-height
2 Antworten
Diese Frage ist ähnlich CSS media queries: max-width ODER max-height, aber da meine rep ist nicht hoch genug, ich kann nicht fügen Sie einen Kommentar (Frage) die Antwort, und ich möchte hinzufügen, um die ursprüngliche Frage. Wie
media Query für macbook pro 15"
2 Antworten
Ich versuche anwenden media query für laptop 15" und kleiner mit keinen Erfolg. Hier ist mein Medien-Abfrage: @media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1) { } Und: @media screen and (min-device-width: 1200px) and
CSS-Media-Query min-width funktioniert nicht richtig
3 Antworten
Habe ich eine HTML wie: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Code: NewYork</title> <link rel="stylesheet" href="test.css" /> </head> <body data-ng-app="us"> <input type="text" /> </body> </html> und mein
CSS transform funktioniert nicht IE
3 Antworten
Habe ich dieses stylesheet .rotate div img { -webkit-transform: translate(-18cm, 2cm) rotate(-90deg); /* WebKit */ -webkit-transform-origin: top right; -moz-transform: translate(-18cm, 2.5cm) rotate(-90deg);/* Mozilla */ -moz-transform-origin: top right; -o-transform: rotate(90deg); /* Opera */ -o-transform-origin: top center; -ms-transform: translate(-18cm)
Was ist der beste Weg, um entfernen html5-video-hintergrund für mobile Anwender
3 Antworten
ERKLÄRUNG: EIN Kunde von mir will ein hintergrund-video auf seinem responsive website. Aber er möchte auch, es zu entfernen, um für tablet/Handy-Nutzer. Ich weiß, das kann man mit media queries, aber das video würde noch laden als
Media Queries überschreiben nicht native-Formate?
2 Antworten
Frage ich mich, warum einige meiner media queries überschreiben nicht die native Stile in der view-port Ihres seins genannt. Ich bin versucht zu restyle ein Menü dementsprechend, zu stapeln, und die Navigations-Bereich ist die Höhe, mehr in
CSS-Regeln für webkit-basierte Browser
1 Antworten
Habe ich das nächste CSS-code: #mgheader .letters { display: inline-block; margin-left: 55px; margin-top: -45px; position: absolute; } #mgheader .letters { display: inline-block; margin-left: 10px; position: absolute; } Nun will ich führen zunächst nur im Google Chrome und
Zeilenumbruch für die media-query ?
4 Antworten
Gibt es eine Lösung für den Zeilenumbruch, wenn die Bildschirm-Auflösung zu klein ist, anstelle von <br> ? weil br break line die ganze Zeit 🙁 Hier mein code <h2>I create unique, clean sites that are easy to
Ändern von HTML von CSS-media-query
4 Antworten
Habe ich eine situation, in der ich mich ändern will ein HREF in einer ungeordneten Liste in HTML, wenn ein CSS-media-query ist wahr. Speziell möchte ich ändern, HREF aus calendar.html zu calendar2.html auf der folgenden Seite. Ist
PHP-version von CSS Media Queries
5 Antworten
Kann nichts finden im web für diese, werfen wollte, die Frage, die es gibt. Ist das eine PHP-version von CSS Media Queries? Ich bin gewissermaßen neugierig, obwohl, was wollen Sie erreichen? mit MobileESP und wollte, um bestimmte
Wie laden Sie die Webseite, wenn die Orientierung verändert?
5 Antworten
Ich versuche, die ein Ereignis auslösen, mit jQuery mobile, das automatisch lädt die Seite, wenn das Gerät seine Orientierung ändert. Ich habe media queries geschrieben mit max-device-width, orientation:landscape, und orientation: portrait. Da die <video> nicht korrekt skaliert...die
das iPhone 5 ist nicht die Darstellung der responsive Modus der website richtig
6 Antworten
Habe ich erstellt diese website, und so weit ich habe nicht in der Lage gewesen, um herauszufinden, warum nur auf bestimmte iPhone-Handys, die website wird nicht angezeigt, in Ihrer responsive-Modus. (es zeigt korrekt auf den meisten iPhone-Handys).
Bootstrap 3 - Drucken / PDF
3 Antworten
Ich muss meinen Lebenslauf drucken aber der alte trick <link href="css/bootstrap.min.css" rel="stylesheet" media="print"> funktioniert nicht mehr seit Bootstrap 3 ist mobile-first (start aus dem kleinen Gerät, und fügen Sie dann media queries für größeren Bildschirm), also wenn
Wie kann Sie zwingen, eine website im landscape-Modus bei der Anzeige auf einem mobilen Gerät?
2 Antworten
Ich habe gesehen eine Menge Fragen über diese, aber keine endgültige Antwort auf, wie dies zu tun in einer Razor - /MVC-Website, wo die mobile Website wird ermittelt, indem die DefaultDisplayMode Klasse. Auch, viele der Antworten sind
Print media queries ignoriert in Chrom?
5 Antworten
Ich bin momentan dabei, einige print-styles mit den folgenden: @media print { /* Styles */ } Wie wir mit SASS allen Stilrichtungen erhalten Sie zusammengestellt in einem stylesheet, styles.css zur Laufzeit, die ist deklariert in der <head>
media-queries für smartphone portrait -, Landschafts-und desktop?
1 Antworten
Ich versuche zu verschiedene media-queries für smartphone-Orientierung und desktop -, ich will den Gegner portrait und Landschaft. Ich bin mir bewusst, alle anderen stack-links so: Medien-Abfrage, um den Gegner die meisten smartphone 3 media queries für iphone
Medien-Abfrage, um den Gegner die meisten smartphone
2 Antworten
Schrieb ich einige CSS-code, um eine HTML-Seite, die passen besser in den mobilen Browser. Um sicher zu sein, dass mein CSS gelten nur auf dem Handy, ich nutze folgende media query : @media only screen and (max-device-width:
Was bedeutet diese Zeile CSS zu bedeuten??? @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
2 Antworten
Fand ich die folgende Zeile von code in WordPress' Twenty Eleven-theme-stylesheet. Was bedeutet es? @media only screen and (min-device-width: 320px) and (max-device-width: 480px) Werfen Sie einen Blick auf diese website: responsivedesign.ca/resources möglich, Duplikat der Was ist der
@media-Abfragen und Bild tauschen
3 Antworten
Ich bin neu in CSS und hier im forum. Aber ich arbeite schon an einem kleinen Projekt wo ich will das Bild in meine Website komplett zu verändern, wenn der browser in der Größe geändert wird. Habe