Laden unterschiedlicher CSS-Dateien je nach Browser

Question

Wie man je nach Browsertyp unterschiedliches CSS lädt. Ich möchte verschiedene CSS für IE und Firefox in asp.net laden. Ich benutze IE8 und höher und Firefox 3 und höher. Bitte helfen Sie mir.

Answer 1

Anfrage.Browser gibt Ihnen vollständige Browserinformationen, wo Sie Version, Browsername, Browsertyp usw. überprüfen können.

if(Request.Browser.Browser == "IE")
    {
        HtmlLink css = new HtmlLink();
        css.Href = ResolveClientUrl("~/style/StyleSheet.css");
        css.Attributes["rel"] = "stylesheet";
        css.Attributes["type"] = "text/css";
        css.Attributes["media"] = "all";
        Page.Header.Controls.Add(css);
    }

Answer 2

Sie können die folgende bedingte css-Anweisung verwenden, um eine css-Datei für den IE nach der Haupt-css-Datei für Firefox und andere Browser zu laden. So können Sie einen Großteil des gleichen CSS-Codes wiederverwenden und nur die Eigenschaften überschreiben, die der IE nicht richtig hinbekommt:

<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="styles/browser.css" />
<![endif]-->

Die obige bedingte Anweisung gilt für IE-Versionen kleiner oder gleich IE6, aber Sie können den Wert nach Belieben festlegen.

Weitere Informationen über bedingte CSS-Anweisungen finden Sie hier: http://www.quirksmode.org/css/condcom.html

Answer 3

Ihr Haupt-CSS sollte dasjenige sein, das von den meisten Browsern (einschließlich Firefox) unterstützt wird. Dann können Sie bedingte HTML-Anweisungen verwenden, um IE-spezifische Stylesheets zu laden

    <!--[if gt IE 7]>
    According to the conditional comment this is Internet Explorer greater than IE8<br />
<link rel="stylesheet" type="text/css" href="IEgreatethan7.css">

    <![endif]-->

oder wenn Sie genau sein wollen

    <!--[if IE 8]>
    According to the conditional comment this is Internet Explorer equal to IE8<br />
<link rel="stylesheet" type="text/css" href="IE8.css">

    <![endif]-->

Answer 4

Sie können es so verwenden.

<!--[if IE 7]>
     <link href="style-ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

Gracias.

Answer 5

Wenn Sie Ihre Frage googeln, werden Sie die Antwort finden:

Client-seitig(javascript):

• http://tycoontalk.freelancer.com/javascript-forum/101813-loading-different-css-based-on-browser.html

• http://api.jquery.com/jQuery.browser/

Server-seitig (asp.net): http://msdn.microsoft.com/en-us/library/3yekbd5b.aspx

Suchen Sie auch auf Stackoverflow: Browser-Erkennung