Gibt es eine Möglichkeit, das folgende CSS div
nur in Google Chrome auf ein bestimmtes anzuwenden ?
position:relative;
top:-2px;
css
google-chrome
css-hack
user1213707
quelle
quelle
Antworten:
CSS-Lösung
von https://jeffclayton.wordpress.com/2015/08/10/1279/
JavaScript-Lösung
quelle
data-ng-class
für Angular verwendet und eine.chrome
Klasse mit dem JS-Ausdruck hinzugefügt . Lief wie am Schnürchen. DankeWie wir wissen, ist Chrome ein Webkit- Browser, Safari ist auch ein Webkit-Browser und auch Opera. Daher ist es sehr schwierig, Google Chrome mithilfe von Medienabfragen oder CSS-Hacks zu erreichen, aber Javascript ist wirklich effektiver.
Hier ist der Javascript-Code, der auf Google Chrome 14 und höher abzielt.
und unten finden Sie eine Liste der verfügbaren Browser-Hacks für Google Chrome, einschließlich des von diesem Hack beeinflussten Browsers
WebKit-Hack:
Unterstützt Hacks:
Google Chrome 28 und Google Chrome> 28, Opera 14 und Opera> 14
Property / Value Hacks:
Google Chrome 28 und Google Chrome <28, Opera 14 und Opera> 14 sowie Safari 7 und weniger als 7. - Google Chrome : 28 und früher - Safari : 7 und früher - Opera : 14 und höher
JavaScript-Hacks: 1
JavaScript-Hacks: 2 {Webkit}
JavaScript-Hacks: 3
Media Query Hacks: 1
Media Query Hacks: 2
Weitere Informationen finden Sie auf dieser Website
quelle
@supports (-webkit-appearance:none) { }
arbeitet jetzt für MS Edge.Ein Update für Chrome> 29 und Safari> 8:
Safari unterstützt jetzt auch diese
@supports
Funktion. Das bedeutet, dass diese Hacks auch für Safari gültig sind.ich würde empfehlen
@ http://codepen.io/sebilasse/pen/BjMoye
quelle
Diese CSS-Browserauswahl kann Ihnen helfen. Schau mal.
quelle
http://www.templatemonster.com/help/how-to-create-browser-specific-css-rules-styles.html
Wenden Sie bestimmte CSS-Regeln nur
.selector:not(*:root)
mit Ihren Selektoren auf Chrome an :quelle
Ich bin noch nie auf eine Instanz gestoßen, in der ich bis jetzt einen CSS-Hack nur für Chrome durchführen musste. Ich fand jedoch, dass dies den Inhalt unter eine Diashow verschiebt, wo klar ist: beides; hat nichts in Chrome beeinflusst (hat aber überall gut funktioniert - sogar im IE!).
quelle
So einfach. Fügen Sie Ihrem Element beim Laden einfach eine zweite Klasse oder ID hinzu, die angibt, um welchen Browser es sich handelt.
Erkennen Sie also im Grunde genommen am Frontend den Browser und setzen Sie dann die ID / Klasse. Ihr CSS wird mit diesen browserspezifischen Namensschildern versehen
quelle
Wenn Sie möchten, können wir einem bestimmten Brwoser eine Klasse hinzufügen, siehe [Geigenlink] [1] [1]:
quelle
Ich verwende ein Sass-Mixin für Chromstile, um
Chrome 29+
die Lösung von Martin Kristiansson oben auszuleihen .Verwenden Sie es so:
quelle
Chrome bietet keine eigenen Bedingungen, um CSS-Definitionen nur dafür festzulegen! Dies sollte nicht erforderlich sein, da Chrome Websites wie in den w3c-Standards definiert interpretiert.
Sie haben also zwei sinnvolle Möglichkeiten:
quelle
Überprüfen Sie dies. Es funktioniert für mich.
quelle