Erstellen eines transparenten Pfeils über Bild in CSS3
Ich versuche einen Effekt zu erzeugen, bei dem ich einen transparenten Pfeil über einem Bild in CSS3 habe. Siehe das folgende Bild.
Irgendwelche Ideen, wie man diesen Effekt macht? Verwenden Sie WENIGER, wenn das zu irgendeiner Hilfe kommt.
2 Antworten
Um ein transparentes / invertiertes Dreieck in CSS3 zu zeichnen
Sie können die CSS3-Dreieck-Technik verwenden und die umgekehrte Form durch Kombinieren von% co_de erstellen % und :before Pseudo-Objekte, die jeweils einen Teil des Dreiecks zeichnen.
Sie könnten so etwas tun:
%Vor%Hier ist eine Illustration jsfiddle
Ich habe gerade ein Flugzeug orange Hintergrund für das Beispiel verwendet ... aber Sie können es in Bild ändern, und Sie bekommen hoffentlich, was Sie wollten =)
Bearbeiten: und ein endgültigeres Ergebnis könnte dann etwas wie das
seinTags und Links html5 css3 less css-shapes