Text invertiert basierend auf dem Hintergrundbild
Ist es überhaupt möglich, so etwas nur mit CSS / CSS3 oder mit Javascript zu erhalten? aber kein Bild für Text.
2 Antworten
Mit eingeschränkter Unterstützung von alten Browsern können Sie dies mit Text-Clipping erreichen:
für diesen html:
%Vor%mit diesem CSS:
%Vor%Sie erhalten den Hintergrund von der Basis (die die invertierten Farben des ersten Div hat), um nur durch den Text zu zeigen.
Bearbeiten
Habe festgestellt, dass es in einem einzelnen Element gemacht werden kann. Der Stil wäre:
%Vor%Um dies in CSS zu erreichen, müssten Sie Gradienten verwenden. Eine für den Hintergrund und eine für den Text, der Gradient wäre konstant. Sehen Sie sich das an, um sie zu generieren: Ссылка , um dies zu produzieren:
%Vor%Das Hauptproblem, dem Sie immer noch gegenüberstehen, ist jedoch nicht, dass Sie das Hintergrundbild "erkennen" können, um die Textfarbe gegenüberzustellen.
Wenn Sie den Hintergrund erkennen möchten, können Sie in das webkit -webkit-background-composite mit XOR und plus-darker und plus-lighter für Composite-Effekte
schauenHoffe, das hilft.
Tags und Links javascript html css