layui6

标签：间距 layui 30px padding layui6 col

列边距

​ 经过“列间距”的预设类，来设定列之间的间距。且一行中最左的列不会出现左边距，最右的列不会出现右边距。列间距在保证排版美观的同时，还能够进一步保证分列的宽度精细程度。咱们结合网页经常使用的边距，预设了 12 种不一样尺寸的边距，分别是：

/* 支持列之间为 1px-30px 区间的全部双数间隔，以及 1px、5px、15px、25px 的单数间隔 */
layui-col-space1 
layui-col-space2 
layui-col-space4 
layui-col-space5 
layui-col-space6 
layui-col-space8 
layui-col-space10 
layui-col-space12 
layui-col-space14 
layui-col-space15 
layui-col-space16 
layui-col-space18 
layui-col-space20 
layui-col-space22 
layui-col-space24 
layui-col-space25 
layui-col-space26 
layui-col-space28 
layui-col-space30

示例：

<h3>列间距</h3>
<div class="layui-row layui-col-space10">
    <div class="layui-col-md4" >
        <!-- 须要在layui-col-md4里面再加一层div -->
        <div style="">
            1/3
        </div>
    </div>
    <div class="layui-col-md4">
        <div style="">
            1/3
        </div>
    </div>
    <div class="layui-col-md4">
        <div style="">
            1/3
        </div>
    </div>
</div>

注：

1. layui-col-space：设置后不起做用主要是由于设置的是padding,也就是说是向内缩，因此设置背景色padding也是会添上颜色，看起来好像没有间距同样。能够在里面在加一个div，来达到目的。
2. 间距通常不高于30px，若是超过30，建议使用列偏移。

标签：间距,layui,30px,padding,layui6,col
From： https://www.cnblogs.com/chenyutong0321/p/16935102.html