Erstellen von CSS-Sprites aus Photoshop

Ich habe eine PSD mit einem Webdesign.
Jedes Mal, wenn ich das Design verändere, muss ich verschiedene Teile des Bildes mit unterschiedlichen Ebenensichtbarkeiten (für Transparenz) manuell in CSS-Sprites kopieren.

Wie weit lässt sich das automatisieren?

Ich schätze, dass Sie die Frage allgemein halten möchten, aber ein Beispiel wäre wahrscheinlich hilfreich. Sind die Layer-Sichtbarkeiten bereits eingestellt oder müssen Sie diese vor dem Export individuell ändern?
@Pekka: Unterschiedliche Portionen benötigen unterschiedliche Sichtbarkeiten. Beispielsweise wird der Site-Hintergrund sichtbar exportiert, aber der Inhaltshintergrund wird mit unsichtbarem globalen Hintergrund exportiert. (für einen transparenten Schatten)
Aha. Dies erfordert also definitiv eine Stapelverarbeitung. Interessiert zu sehen, was kommt! ...

Antworten (2)

Ich habe einmal ein automatisches Photoshop-Skript verwendet und es hat gut funktioniert.

Das Konzept ist:

  • Jeder Teil ist ein anderes Bild.
  • Jeder Teil (und damit alle Bilder) muss sich ohne andere Bilder im selben Ordner befinden.
  • Führen Sie das Skript aus, das den Ordner und einige Parameter (Größe, CSS-Name usw.) angibt.

  • Das Skript macht:

    1. Führen Sie alle Bilder zu einem mit der angegebenen Größe zusammen.
    2. Generieren Sie die CSS-Datei

Wenn Sie in Ihrem Fall ein Bild ändern, generieren Sie das globale Bild und das CSS über das Skript neu und ... das war's. Möglicherweise müssen Sie das CSS in Ihrem kopieren/einfügen, wenn Sie das generierte nicht verwenden möchten.

Anmerkungen :

Ich habe es mit ein paar Dateien versucht und es hat super funktioniert. Dann habe ich ungefähr 600 Bilder ausprobiert und dann brauchen Sie eine gute CPU und Geduld ;) In diesem Fall verwenden Sie es nicht.

Würde keine Slices verwenden + eine Aktion starten, die mit der Marquee-Auswahl aller Slices beginnt (mit Snap-to-Slices und Dokumentgrenzen aktiviert), aber jedes Mal auf die Auswahl zuschneiden und als PNG speichern, Strg Alt Z rückgängig machen, bis nicht zugeschnitten, Wählen Sie jeden Sektor aus, schneiden Sie ihn zu usw., bis Sie mit allen Sektoren fertig sind, und stoppen Sie dann die Aktion. In der Mitte könntest du jede Ebene ein-/ausblenden, da es immer die gleiche Datei ist, also sollte es keine Konflikte geben ... Also würdest du die Aktion jedes Mal über deine geänderte PSD laden. Das einzige, was mir einfällt, ist, dass Sie tatsächlich die Slice-Grenzen ändern müssen. Oder das... ich habe dich nicht richtig verstanden...

Bearbeiten: Wenn kein Slicing erforderlich ist, dann ein Makro (Aktion), das nur das Ausblenden oder Anzeigen der Ebenen in der gewünschten Reihenfolge enthält, nachdem alle Änderungen vorgenommen wurden. Wie gesagt, vielleicht verstehe ich das nicht...

Während ich Ihren ersten Absatz eher verwirrend finde und es dennoch scheint, mehr zum Workflow hinzuzufügen als ihn zu automatisieren; Ich könnte sehen, wohin Sie mit der Aktion zum Ausblenden / Anzeigen von Ebenen gehen, obwohl ich Slices damit verwenden würde.
Vielen Dank! Ich bemühe mich jedoch sehr, die Ablehnung von wem auch immer zu verstehen ...
Erstellen von CSS-Sprites aus Photoshop
AntwortenHierDatenschutz-Bestimmungen1y, 0v