Problem mit der Bildgröße von Photoshop zum Web

Ich bin neu in Sachen Webdesign, also habe ich eine Vorlage gekauft. Ich möchte einen Text in meiner Kopfzeile ändern. Es wird als PNG-Bild gespeichert. Ich habe die PSD-Datei in Photoshop geöffnet und den Text geändert.

Ich habe diese Ebene dann in eine neue Datei verschoben und als transparente Datei gespeichert.

Die resultierende Datei wird auf meiner Webseite nicht in derselben Größe angezeigt. Auf der Webseite habe ich die Bildgröße eingestellt, aber immer noch das gleiche Ergebnis

Vorlage (Text oben verketten)Vorlage

Photoshop-Datei (siehe Proportionen)

Photoshop

Resultierende WebseiteWebseite

Was verursacht dieses Problem? Wie gesagt, ich habe die Textebene genommen und in ein eigenes Dokument eingefügt, wo ich sie als transparent speichern konnte

Dies wäre wahrscheinlich eine bessere Frage für Stackoverflow. Versuchen Sie, das Bild entweder im Browser (Rechtsklick und Bild anzeigen) oder in einer Bildanzeigeanwendung zu öffnen und zu sehen, ob das Bild so aussieht, wie es sollte? Das würde bestimmen, ob Ihr Code das Bild beeinflusst oder ob das Bild selbst nicht in Ordnung ist. Für mich sieht das so aus, als ob der Browser die Größenänderung des Bildes handhabt. Hast du Feuerwanze? Kapiert. Lernen Sie, es zu benutzen. Liebe es. Sie könnten das Bildelement in Firebug untersuchen und sehen, welches CSS dieses spezifische Element beeinflusst.

Antworten (1)

Es sieht so aus, als ob für das Bild auf Ihrer Webseite ein expliziter Breitenwert in HTML (oder möglicherweise in CSS) festgelegt wurde, aber Sie haben das eigentliche Bild breiter gemacht, um es an den Text anzupassen. Daher wird es auf die gleichen Abmessungen wie zuvor verkleinert.

Wenn dies der Fall ist, sollten Sie den Breitenwert korrigieren oder entfernen. Für dieses spezielle Grafikelement sehe ich keinen guten Grund, es anzugeben, insbesondere in HTML, aber dies kann vom genauen Layout abhängen.

Ich habe das CSS gefunden, das dieses Problem verursacht, und es behoben