实现html可配置换行

有个需求：需要动态的配置某些属性来控制html是否换行

原理

• 利用 <span>、<p> 来实现
• <span>内联元素，不铺满一行，不会换行
• <p> 块元素，独占一行

<div class="div1">
    <span>131313113</span>
    <span>131313113</span>
    <span>131313113</span>
</div>

<!-- 通过p标签实现可配置换行 -->
<div class="div2">
    <span>131313113</span>
    <p></p>
    <span>131313113</span>
    <p></p>
    <span>131313113</span>
</div>

* {
    margin: 0;
    padding: 0;
}

.div1 {
    background-color: green;
}

.div2 {
    margin-top: 40px;
    background-color: yellow;
}

span {
    margin: 10px 0;
    background-color: red;
}

p{
    height: 10px;
}