Möglich Schrift transparent zu machen?

[NewNoise]

Hallo,

ist es möglich einen Effekt wie mit Photoshop auf dem Bild erstellt per HTML/CSS hinzubekommen?

Danke
noise

 

[ein schlauer]

Was für ein Effekt soll das sein? Das ist ein grauer Text mit der Farbe #7B726A vor einem Hintergrund mit der Farbe #C3C145 - ich sehe da keine Transparenz.

 

[NewNoise]

Okay, ich gebe zu es kommt auf dem Bild nicht so gut raus, aber die Schrift ist durchsichtig. Das Bild ist an der Stelle nur sehr einfarbig

 

[kkapsner]

Nein.

 

[ein schlauer]

Okay, ich gebe zu es kommt auf dem Bild nicht so gut raus, aber die Schrift ist durchsichtig. Das Bild ist an der Stelle nur sehr einfarbig

Mal abgesehen davon, dass es auf dem Bild gar nicht rauskommt, gesucht hast du nach deiner Frage aber schon?

 

[NewNoise]

ja. und google konnte mir nicht weiterhelfen?
wieso hätte ich etwas finden sollen?

 

[ein schlauer]

ja. und google konnte mir nicht weiterhelfen?

Tut mir leid das glaube ich nicht, es sollte doch nicht so schwer sein in google CSS und transparenz einzugeben?

 

[NewNoise]

ja und dann?
steht da eine menge dazu wie man hintergründe durchsichtig machen kann etc? aber nichts zu text ...

 

[ein schlauer]

ja und dann?
steht da eine menge dazu wie man hintergründe durchsichtig machen kann etc? aber nichts zu text ...

Nicht? Dann hast du es nicht richtig gelesen

 

[NewNoise]

meine güte. möchtest du mir helfen und nen tipp/link geben oder nicht?

 

[ein schlauer]

meine güte. möchtest du mir helfen und nen tipp/link geben oder nicht?

Willst du dir helfen lassen? Wir haben bis jetzt nur deine Behauptung das du nichts gefunden hast, mit einer falschen Schlußfolgerung und einer Grafik, wo dein Problem nicht nachvollziehbar ist. Es wäre extrem hilfreich, wenn du uns sagen würdest, was du versucht hast, dann liesse sich dir auch helfen.

 

[Arcsinh]

Naja, in dem Fall kannst du der Schrift einfach die selbe Farbe geben wie dem Hintergrund ODER du setzt color: transparent; bei der Schrift.

 

[kkapsner]

@Arcsinh: durch color: transparent; wird nur der Text durchsichtig und deswegen einfach unsichtbar - der Hintergrund wird dadurch noch lange nicht durchsichtig.

 

[dkdenz]

Das auf dem Bild ist eine Maske. Und sowas gibt's nicht in CSS ...
Das könnte man höchstens faken ...

 

[NewNoise]

Und wie könnte man es faken? Ich würde es ja einfach mit Grafik machen, aber der Text da drin sind Überschriften, da müsste ich für jeden Eintrag ein neues Bild anlegen.

 

[dkdenz]

Den Tag mit einer entsprechenden Hintergrundgrafik versehen, in der der Text als Bild ist (mit entsprechender Transparenz) und dann den realen Text mit text-indent außerhalb des sichtbaren Bereiches verschieben.
Aber da Du es als Überschriften haben willst, ist das eher nicht zu empfehlen: http://luigimontanez.com/2010/stop-using-text-indent-css-trick/

 

[Arcsinh]

@Arcsinh: durch color: transparent; wird nur der Text durchsichtig und deswegen einfach unsichtbar - der Hintergrund wird dadurch noch lange nicht durchsichtig.

Stimmt...

 

[ein schlauer]

Das auf dem Bild ist eine Maske.

was meinst du denn damit?
Das ist einefach eine Schrift auf einen Hintergrund, das läßt sich ohne Probleme mit CSS umsetzen. Oder was übersehe ich?

 

[dkdenz]

Ich erkenne das als Maske.
Da ist eine Ebene mit dem Hintergrund,
darüber eine Ebene mit dem farbigen Balken.
Dann Schrift setzen, auswählen, auf die farbige Ebene gehen,
Auswahl löschen, Textebene löschen und somit scheint der Hintergrund durch den farbigen Balken mit der gelöschten Schrift.

 

[ein schlauer]

Naja, das ist doch nur das Prinzip der Umsetzung mit Photoshop. Aber im Endeffekt ist es doch einfach eine Schrift in der Farbe des Hintergrund. Also so etwas:

<style type="text/css">
#x{
    background-color: #7B726B;
}
#x span{
    background-color: #C3C145;
    color: #7B726B;
    font-size:3em;
    text-transform:uppercase;
    
}

</style>
<div id="x">
<span>fjellsmug</span>
</div>

Und den Stempel Effekt kriegt man mit einem CSS3 text-shadow hin.