overflow-clip-margin
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die overflow-clip-margin CSS Eigenschaft bestimmt, wie weit außerhalb ihrer Begrenzungen ein Element mit overflow: clip gezeichnet werden darf, bevor es abgeschnitten wird. Die durch diese Eigenschaft definierte Grenze wird als overflow clip edge des Feldes bezeichnet.
Syntax
css
/* <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 padding-box ist, gibt die Kanten des Feldes an, die als Ursprung der Overflow-Clip-Kante verwendet werden. Der in overflow-clip-margin angegebene <length>-Wert muss nicht negativ sein.
Hinweis:
Wenn das Element nicht 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 [0,∞]>
<visual-box> =
content-box |
padding-box |
border-box
Beispiele
HTML
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
css
.box {
border: 3px solid black;
width: 250px;
height: 100px;
overflow: clip;
overflow-clip-margin: 20px;
}
Ergebnis
Spezifikationen
| Specification |
|---|
| CSS Overflow Module Level 3 # overflow-clip-margin |
Browser-Kompatibilität
Loading…
Siehe auch
- Verwandte CSS-Eigenschaften:
text-overflow,white-space,overflow,overflow-inline,overflow-x,overflow-y,clip,display