overflow-clip-margin CSS property
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Die overflow-clip-margin-Eigenschaft von CSS bestimmt, wie weit außerhalb seiner Grenzen ein Element mit overflow: clip gezeichnet werden darf, bevor es abgeschnitten wird. Die durch diese Eigenschaft definierte Begrenzung wird als Überlauf-Clip-Kante des Kastens bezeichnet.
Syntax
/* <length> values */
overflow-clip-margin: 20px;
overflow-clip-margin: 1em;
/* <visual-box> | <length> */
overflow-clip-margin: content-box 5px;
/* Global values */
overflow-clip-margin: inherit;
overflow-clip-margin: initial;
overflow-clip-margin: revert;
overflow-clip-margin: revert-layer;
overflow-clip-margin: unset;
Der <visual-box>-Wert, der standardmäßig auf padding-box gesetzt ist, gibt den Kantenbereich des Kastens an, der als Ursprung der Überlauf-Clip-Kante verwendet wird. Der im overflow-clip-margin angegebene <length>-Wert muss nicht-negativ sein.
Hinweis:
Wenn das Element kein overflow: clip hat, wird diese Eigenschaft ignoriert.
Formale Definition
| Anfangswert | 0px |
|---|---|
| Anwendbar auf | alle Elemente |
| Vererbt | Nein |
| Berechneter Wert | the computed <length> and a <visual-box> keyword |
| Animationstyp | diskret |
Formale Syntax
overflow-clip-margin =
<visual-box> ||
<length>
<visual-box> =
content-box |
padding-box |
border-box
Beispiele
HTML
<div class="box">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur.
</div>
CSS
.box {
border: 3px solid black;
width: 250px;
height: 100px;
overflow: clip;
overflow-clip-margin: 20px;
}
Ergebnis
Spezifikationen
| Spezifikation |
|---|
| CSS Overflow Module Level 3 # overflow-clip-margin |
Browser-Kompatibilität
Siehe auch
- Verwandte CSS-Eigenschaften:
text-overflow,white-space,overflow,overflow-inline,overflow-x,overflow-y,clip,display