html运行实例（cssref_box-decoration-break）-搜寻教程库

代码示例：（标识：cssref_box-decoration-break）

<!DOCTYPE html>
<html>
<head>
<style>
span {
  border: 5px solid red;
  padding:  0em 1em;
  border-radius: 16px;
  font-size: 24px;
  line-height: 2;
}

span.ex1 { 
  -webkit-box-decoration-break: clone;
  -o-box-decoration-break: clone;
  box-decoration-break: clone;
}

span.ex2 { 
  -webkit-box-decoration-break: slice;
  -o-box-decoration-break: slice;
  box-decoration-break: slice;
}
</style>
</head>
<body>

<h1>box-decoration-break 属性</h1>

<h2>box-decoration-break: clone:</h2>
<span class="ex1">CSS<br>is<br>easy<br>to learn</span>

<h2>box-decoration-break: slice (默认):</h2>
<span class="ex2">CSS<br>is<br>easy<br>to learn</span>

<p><b>注释：</b>IE/Edge 不支持 box-decoration-break 属性。</p>

</body>
</html>