2010-12-16 6 views
2

Ich möchte einige CSS-Attribute nur für IE 6,7,8 in einer CSS-Datei verwenden. ist es möglich? Ist es möglich, für jedes Attribut eine bestimmte IE-Version zu verwenden?Gibt es eine Möglichkeit, CSS-Attribute speziell für IE8,7,6 in einer CSS-Datei geschrieben

somthing wie folgt aus:

.mystyle { 
    top:5px 
    top:-30px //only if ie6 
    top:-5px //only if ie8 
} 

ich weiß über <![If lt IE7]>-Tags, aber ich möchte nicht noch eine CSS-Datei erstellen.

+0

Ja http://en.wikipedia.org/wiki/CSS_filter –

Antwort

5

Dieses Skript ist winzig, und gefüllt mit ehrfürchtig: http://rafael.adm.br/css_browser_selector/

Es wird das HTML-Element setzen Klassen auf, die an den Browser des Benutzers entsprechen. So können Sie Dinge wie folgt tun:

.ie7 .mystyle { top:5px;} 
.ie8 .mystyle { top:-30px;} 

Ich würde keine neue externe Javascript-Datei nur für dieses Skript erstellen. Es ist so klein, dass ich es normalerweise nur an die Spitze meiner vorhandenen externen Javascript-Datei anschließe.

+0

das ist eine anständige Lösung für dieses Problem +1! - aktualisierte meine Antwort, klug so zu sein && nicht Javascript-abhängig – lnrbob

+0

Wow, ich mochte diese Lösung :). @Inrbob: Ich mochte deine Lösung auch. Im Normalfall hätte ich Ihre Lösung bevorzugt, js nicht zu verwenden! aber leider habe ich viele html-dateien und ich möchte nicht alle bearbeiten. –

3

Es gibt eine Reihe von Hacks, die Sie in Ihren Stylesheets selbst verwenden können, aber das wird allgemein als schlechte Praxis angesehen. Hier ist an example

Warum möchten Sie nicht mehrere Stylesheets verwenden?

von Stephen Post inspiriert Sie dies tun könnte (von Paul Irish von html5 boilerplate gestohlen):

<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]--> 
<!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]--> 
<!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]--> 
<!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]--> 

Finale bearbeiten

erklären sollte. Wenn Sie dies zu HTML hinzufügen, werden Sie eine übergeordnete IE-Klasse bedingt setzen. Die letzte Zeile gibt keine Klasse aus, wenn der Browser größer ist als IE9 (keine) oder nicht IE

+0

Ich mag die HTML5-Boilerplate-Lösung. Sehr ähnlich wie meine Antwort. +1 für nicht auf JS angewiesen. Wenn jedoch ein größerer Grad an Flexibilität erforderlich ist (z. B. das Targeting eines bestimmten Browsers wie FF3 oder Chrome), müssen Sie etwas wie JavaScript verwenden. – Stephen

+0

ganz richtig! Zum Glück sind diese Korrekturen in der Regel seltener und oft weniger ein Problem, wenn Js deaktiviert ist :) – lnrbob

+0

Weißt du was? Du hast recht. Es ist selten. – Stephen

0

Sie können IE-Hacks verwenden, die das erreichen, wonach Sie suchen. Es ist jedoch nicht ratsam, dies zu tun; langfristige Wartung wird schwierig.

Die bedingte Kommentarlösung ist die einfachste und sauberste Lösung und wird von MS unterstützt. Du solltest sie benutzen.

Verwandte Themen