Transparenz in Bild

[EinfachSö]

Hallo,

Ich bin noch seeeehr neu hier und habe kein passendes Forum hierfür gefunden.
Ich bin auch sehr neu im Thema html-coding.

Und zwar:

Ich will für meine Startseite, meiner Homepage, ein Hintergrundbild mit zwei Buttons darauf.
Ich habe es nun soweit, dass ich mein Hintergrundbild schön und ordentlich habe und die Buttons habe ich auch entworfen.
Die Buttons habe ich aber separat "gezeichnet", da es verlinkungen werden sollen und sie sollen ein anderes Bild haben, wenn ich die Maus herüberhalte.
Meine Frage nun:
Ich habe um die Buttons im Abstand von ca. 5px einen kleinen Rand. Zwischen dem Rand und dem Button ist aber nichts also Transparenz.
Das Problem ist, das .jpg keine Transparenz unterstützt und andere gute Datei-typen habe ich nicht gefunden, da sie nie den Rand mit draufhaben. Nur den Button.

Dazu kommt, dass ich schwören könnte, dass heute morgen Transparenz von jpg unterstützt wurde.
Man sieht bei win7, ja schon wie das Bild aussieht. Das ist ja das Logo. Und da war heute morgen fast alles grau (also Transparent.Button ist 75x150 und transparenz 1920x1080)

Was kann ich machen?


Mfg
EinfachSö

 

[spaceCookie]

Könntest du deine Frage bitte konkretisieren? Du redest ziemlich viel drum und ich verstehe ehrlich gesagt deine Absicht nicht.

Ich habe um die Buttons im Abstand von ca. 5px einen kleinen Rand. Zwischen dem Rand und dem Button ist aber nichts also Transparenz.
Das Problem ist, das .jpg keine Transparenz unterstützt und andere gute Datei-typen habe ich nicht gefunden, da sie nie den Rand mit draufhaben. Nur den Button.

Das ist kein Problem des Dateiformats sondern ein Problem des Bildes selbst. Du musst es falsch ausgeschnitten haben o.Ä. verwendet GIF oder PNG.

Dazu kommt, dass ich schwören könnte, dass heute morgen Transparenz von jpg unterstützt wurde.

Nein. JPG unterstützt keine Transparenz.

also Transparent.Button ist 75x150 und transparenz 1920x1080

Du hast ein Bild das dir als Button dient und insgesamt 1920x1080 Pixel groß ist, du möchtest aber nur 75x150 davon als button nutzen?

 

[EinfachSö]

Du hast ein Bild das dir als Button dient und insgesamt 1920x1080 Pixel groß ist, du möchtest aber nur 75x150 davon als button nutzen?

Nein, sry. damit wollte ich nur sagen, dass mein Button im Vergleich zur gesamten Bilddatei ziemlich klein ist. Daher habe ich in Erinnerung, dass die Vorschau vom jpg Bild ziemlich klein war.

Und ja wegen dem drum herum gerede. Das ist mein großes Laster :(

Also. Ich ahbe das Bild vom Button. Und um den Button herum ist ein Rand und zwischen Rand und Button ist Transparenz. Da ich beides in einem Bild haben möchte, brauche ich ein Datei-Format, dass Transparenz unterstützt und gut für websites gedacht ist, also schnell lädt. ;)

 

[spaceCookie]

brauche ich ein Datei-Format, dass Transparenz unterstützt und gut für websites gedacht ist, also schnell lädt.

Wie gesagt du hast keine große Auswahl. Entweder du nimmst GIFs und machst Abstriche in der Bildqualität oder PNG und machst Abstriche in der Performance.

 

[EinfachSö]

ok danke ;)

 

[Tronjer]

Lege das große Hintergrundbild als .jpg auf den Body, und die kleinen 150x75 Images als .png auf dein HTML-Buttons. Die beanspruchen doch nicht besonders viel Speicherplatz.

Falls es um die üblichen Glossy-Buttons geht, ließe sich so etwas auch mit CSS 3 realisieren. Dann bräuchtest du dafür gar keine Bilder, es sei denn als Fallback für den IE.

 

[spaceCookie]

Ich sag ja. Die Fragestellung ist total unverständlich. Ich dachte es geht hier um sowas:
http://img6.imagebanana.com/img/qe3dugv1/bsp.png

und die Problemstellung wäre dass er diesen "transparenten Border" nicht hinbekommt. Also zu der Fragestellung herrscht eindeutig Aufklärungsbedarf.

Falls es um die üblichen Glossy-Buttons geht, ließe sich so etwas auch mit CSS 3 realisieren. Dann bräuchtest du dafür gar keine Bilder, es sei denn als Fallback für den IE.

Ach, wer braucht denn heutzutage noch Crossbrowser-Kompatibilität? Völlig überbewertet

 

[EinfachSö]

Ich sag ja. Die Fragestellung ist total unverständlich. Ich dachte es geht hier um sowas:
http://img6.imagebanana.com/img/qe3dugv1/bsp.png

und die Problemstellung wäre dass er diesen "transparenten Border" nicht hinbekommt. Also zu der Fragestellung herrscht eindeutig Aufklärungsbedarf.



Ach, wer braucht denn heutzutage noch Crossbrowser-Kompatibilität? Völlig überbewertet

genau so meine ich das