iinfinityy
Neues Mitglied
Hallo,
ich bin noch recht neu in Sachen Webdesign und CSS und versuche gerade verzweifelt einen rechteckigen Kasten mit einer dreieckigen Öffnung nach innen per CSS zu erstellen, habe mich auch schon recht intensiv mit Geometrischen Formen mit CSS beschäftigt, komme aber einfach nicht weiter, ich hoffe Ihr könnt mir weiterhelfen. Also im Prinzip soll das gelbe Dreieck durchsichtig sein, aber der blaue Hintergrund nicht durchscheinen, sprich da wo momentan das gelbe Dreieck ist, der Bereich soll komplett durchsichtig werden, weiß aber einfach nicht wie ich das hinbekommen soll.
Hier mal noch der HTML und CSS Code den ich soweit erstellt habe:
vielen lieben Dank
by iinfinityy
ich bin noch recht neu in Sachen Webdesign und CSS und versuche gerade verzweifelt einen rechteckigen Kasten mit einer dreieckigen Öffnung nach innen per CSS zu erstellen, habe mich auch schon recht intensiv mit Geometrischen Formen mit CSS beschäftigt, komme aber einfach nicht weiter, ich hoffe Ihr könnt mir weiterhelfen. Also im Prinzip soll das gelbe Dreieck durchsichtig sein, aber der blaue Hintergrund nicht durchscheinen, sprich da wo momentan das gelbe Dreieck ist, der Bereich soll komplett durchsichtig werden, weiß aber einfach nicht wie ich das hinbekommen soll.
Hier mal noch der HTML und CSS Code den ich soweit erstellt habe:
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Unbenanntes Dokument</title>
<link href="test.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="kasten-offen">
</div>
</body>
</html>
Code:
#kasten-offen {
width: 200px;
height: 200px;
background: #037CA9;
position: absolute;
margin-left: 0px;
margin-top: 50px;
}
#kasten-offen:before {
content: "";
position: absolute;
width: 0;
height: 0;
margin-top: 0px;
margin-right: 0%;
margin-bottom: 0;
margin-left: 35%;
width: 0px;
height: 0px;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-top: 30px solid yellow;
}vielen lieben Dank
by iinfinityy
Zuletzt bearbeitet von einem Moderator:
