CSS shape-margin 属性与 shape-outside 属性结合使用，以定义文本或内容应在指定形状周围保持的边距。通过这些属性，您可以控制内容与其环绕的形状之间的间距。
浮。
shape-margin = <length-percentage>;以下示例演示了 shape-margin： 10px 属性在空间周围添加 10px 的边距 -
<html>
<head>
<style>
.box {
max-width: 350px;
}
.shape-container {
float: left;
width: 140px;
height: 140px;
background-color: violet;
clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
shape-outside: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
shape-margin: 10px;
}
</style>
</head>
<body>
<div class="box">
<div class="shape-container"></div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</div>
</body>
</html>以下示例演示了 shape-margin： 9% 属性在空间周围添加 9% 的边距 -
<html>
<head>
<style>
.box {
max-width: 350px;
}
.shape-container {
float: left;
width: 140px;
height: 140px;
background-color: violet;
clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
shape-outside: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
shape-margin: 9%;
}
</style>
</head>
<body>
<div class="box">
<div class="shape-container"></div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</div>
</body>
</html>
