块阵列Box Array

针对宽度相同的块，不必对子元素进行宽度设定，轻松实现排列

<ul class="box-array list3">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
</ul>

响应式布局Responsive Layout

通过预定义的class="list"、class="list-m"、class="list-s"来对中、小屏幕作排列调整例：添加class="list3 list-s1"，即列表元素默认为一行3个，视窗像素小于750px则转换为一行1个

<ul class="box-array list3 list-s1">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

class="list-m"、class="list-s"可以同时叠加，在不同视窗大小时按权重执行设定值

<ul class="box-array list3 list-m2 list-s1">
    ...
</ul>

反序列Reverse

添加class="reverse"使块元素反序列

<ul class="box-array reverse list3">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
</ul>

间距Padding

添加class="plr"使块元素填充左右内间距padding-left:0.75rem;padding-right:0.75rem

<ul class="box-array list3 plr">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
</ul>