Wie kann ich mit dem CLIP -Pfad -CSS einen oberen Rand über den oberen Rand meines exponierten Inhalts hinzufügen? [Dupl
Posted: 25 Jan 2025, 15:53
Ich wollte mit dem von mir entworfenen Clip-Pfad einen oberen Rand erstellen.
Ich habe auch den Kastenschatten verwendet, aber der obere Rand ist nicht sichtbar.
Das obere Design erstelle ich mithilfe eines Clippfads. Ich möchte oben an meinem angezeigten Inhalt einen Rahmen haben, der reagiert.
Wie dieses – Beispieldesign
Mein Code –
Ich habe auch den Kastenschatten verwendet, aber der obere Rand ist nicht sichtbar.
Das obere Design erstelle ich mithilfe eines Clippfads. Ich möchte oben an meinem angezeigten Inhalt einen Rahmen haben, der reagiert.
Wie dieses – Beispieldesign
Mein Code –
Code: Select all
Clip Path with Visible Border
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.divider {
position: relative;
background-color: blueviolet;
clip-path: polygon(40% 0%, 60% 0%, 64% 10%, 100% 10%, 100% 100%, 0% 100%, 0% 10%, 35% 10%);
padding: 200px;
box-shadow: -1px -10px 0px #03FAFE; /* Simulates a border */
}