FAQ: Mehrere CSS Dateien

Hallo,

Kann man mehrere .css Dateien in einer html Datei ohne Komplikationen aufrufen? Der Übersichtlichkeit halber möchte ich die css Daten aufteilen. Z.B. so:

<title></title>
</head>
<body>

<link rel="stylesheet" type="text/css" href="style1.css">
<link rel="stylesheet" type="text/css" href="style2.css">
<link rel="stylesheet" type="text/css" href="style3.css">
<link rel="stylesheet" type="text/css" href="style4.css">

usw.

  1. Ja, das kann man schon. Allerdings solltest Du berücksichtigen, dass jede Datei dann einen zusätzlichen HTTP-Aufruf samt dazugehörendem Overhead (je nach Keepalive bis zu 4 x Verbindungsaufnahme, HTTP-Request-Header, HTTP-Response-Header.

    Es wäre wahrscheinlich sinnvoller, die Dateien nur intern zur Entwicklung zu trennen und eine Art Precompiler zu bauen, der sie für die Live-Version wieder zusammenfügt.

    Gruß, LX

    --
    RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
    RFC 1925, Satz 11a: Siehe Regel 6a
    1. Es wäre wahrscheinlich sinnvoller, die Dateien nur intern zur Entwicklung zu trennen und eine Art Precompiler zu bauen, der sie für die Live-Version wieder zusammenfügt.

      Der muss garnicht so "tragisch" sein ein Script welches die Files einfach liest und zusammensetzt ist die einfachste Möglichkeit - wenn alles im gleichen Verzeichnis liegt, braucht man nichtmal die Pfade anpassen.

      1. Eine optimale Version eines solchen Scripts geht folgendermaßen vor:

        • wenn sich an der gecacheten Version nichts geändert hat, liefere diese aus und beende das Script,
        • wenn doch, setze die Schnipsel zu einem String zusammen,
        • filtere Kommentare aus dem CSS-String (geht leicht mittels RegExp, auf ungreedyness achten),
        • speichere das Ergebnis im Cache und liefere es aus.

        Gruß, LX

        --
        RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
        RFC 1925, Satz 11a: Siehe Regel 6a
        1. Hi,

          • wenn sich an der gecacheten Version nichts geändert hat, liefere diese aus und beende das Script,
          • wenn doch, setze die Schnipsel zu einem String zusammen,
          • filtere Kommentare aus dem CSS-String (geht leicht mittels RegExp, auf ungreedyness achten),

          Da es hacks gibt, die auf Kommentare bauen, würde ich diesen Schritt überdenken.

          • speichere das Ergebnis im Cache und liefere es aus.

          cu,
          Andreas

          --
          Warum nennt sich Andreas hier MudGuard?
          O o ostern ...
          Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
          1. Da es hacks gibt, die auf Kommentare bauen, würde ich diesen Schritt überdenken.

            Mein eigener Filter erkennt 2 Kommentar-Hacks für den IE5/5.5 (die einzigen mir bekannten funktionierenden CSS-Hacks mit Kommentaren): 1. zwischen Eigenschaftsname und Doppelpunkt:

            color/**/: red;

            und 2. zwischen zwei Selektoren (die Definition wird dann komplett ignoriert):

            #foo, /**/ #bar { color: red; }

            Beide werden berücksichtigt (und ein darin stehender Text entfernt), außerdem habe ich noch ein <HACK></HACK>-Tag eingebaut, mit dem ich bestimmte Kommentare von der Filterung ausnehmen kann. Da ich den Filter in meiner Arbeitszeit gebaut habe, darf ich ihn leider nicht hier veröffentlichen.

            Gruß, LX

            --
            RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
            RFC 1925, Satz 11a: Siehe Regel 6a
            1. Ich erhöhe um IE8 (bzw. "greift manchmal auf für IE7"):

              foo /*\**/: bar\9;

              1. Ich benutze grundsätzlich nur solche Hacks, die in validem CSS erlaubt sind, was auf diesen Hack nicht zutrifft. Abgesehen davon: die CSS2.1-Unterstützung in IE8 ist so gut, dass man in den meisten Fällen ohne Hacks auskommt.

                Gruß, LX

                --
                RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
                RFC 1925, Satz 11a: Siehe Regel 6a
                1. @@LX:

                  nuqneH

                  Abgesehen davon: die CSS2.1-Unterstützung in IE8 ist so gut, dass man in den meisten Fällen ohne Hacks auskommt.

                  Dafür ist die CSS-3-Unterstützung in IE8 so schlecht, dass man kaum ohne CSS-Expressions auskommt. Dafür muss man edn 8er allerdings als 7er betreiben.

                  Qapla'

                  --
                  Volumen einer Pizza mit Radius z und Dicke a: pi z z a
                  1. Dafür ist die CSS-3-Unterstützung in IE8 so schlecht, dass man kaum ohne CSS-Expressions auskommt. Dafür muss man edn 8er allerdings als 7er betreiben.

                    Qapla'

                    Einen Erfolg würde ich das jetzt nicht nennen :p

  2. Hi,

    Kann man mehrere .css Dateien in einer html Datei ohne Komplikationen aufrufen?

    <title></title>
    </head>
    <body>

    <link rel="stylesheet" type="text/css" href="style1.css">
    <link rel="stylesheet" type="text/css" href="style2.css">
    <link rel="stylesheet" type="text/css" href="style3.css">
    <link rel="stylesheet" type="text/css" href="style4.css">

    ja, problemlos. Aber bitte nicht im body-Element, wie dein Beispiel andeutet, denn das ist invalides HTML. Ein Stylesheet wird im head (und nur dort!) notiert oder referenziert.
    Zur Effizienz hat sich LX ja schon geäußert.

    So long,
     Martin

    --
    "Hier steht, deutsche Wissenschaftler hätten es im Experiment geschafft, die Lichtgeschwindigkeit auf wenige Zentimeter pro Sekunde zu verringern." - "Toll. Steht da auch, wie sie es gemacht haben?" - "Sie haben den Lichtstrahl durch eine Behörde geleitet."
    1. @@Der Martin:

      nuqneH

      ja, problemlos. […]
      Zur Effizienz hat sich LX ja schon geäußert.

      Du siehst den Widerspruch? Von „problemlos“ kann bei mehreren CSS-Ressource nicht die Rede sein.

      Qapla'

      --
      Volumen einer Pizza mit Radius z und Dicke a: pi z z a
      1. Hallo,

        ja, problemlos. […]
        Zur Effizienz hat sich LX ja schon geäußert.
        Du siehst den Widerspruch?

        nein. Ineffizienz bezeichne ich nicht als *Problem*. Mit der Bastelschere den Rasen zu trimmen, ist auch "problemlos, aber ineffizient". Das sind Eigenschaften, die für mich durchaus in Kombination auftreten können. Und das ist gar nicht mal selten (auch im RL).

        Ciao,
         Martin

        --
        Chef:         Zum vierten Mal in dieser Woche erwische ich Sie nun schon beim Zuspätkommen. Was haben Sie dazu zu sagen?
        Angestellter: Dann muss heute Donnerstag sein.