<form class="layui-form ct-form" table="customstyle">
    <fieldset class="layui-elem-field layui-field-title"><legend>自定义样式</legend></fieldset>
    <div class="layui-form-item">
        <p><code style="margin-left:15px;">可以给任意HTML元素添加 class 或 style 属性</code></p>
        <br>
        <p style="margin-left:15px;"><span class="gray"><strong>示例 style 属性演示: </strong> <strong>&lt;p&gt;</strong> 标签文本变成红色<br>
			   <code><b>  [HTML标签 或 CSS选择器]:</b>p &nbsp;&nbsp;&nbsp;
			   <b>索引:</b>0 &nbsp;&nbsp;&nbsp;
			   <b>属性:</b>style &nbsp;&nbsp;&nbsp;
			   <b>值:</b>color:red; </code>
			   <br>
			   </span>
        </p>
        <br>
        <p style="margin-left:15px;"><span class="gray"><strong>示例 class 属性演示: </strong>WordPress自带图片居中class属性 <strong>&lt;img&gt;</strong> 标签图片居中<br>
			   <code><b>  [HTML标签 或 CSS选择器]:</b>img &nbsp;&nbsp;&nbsp;
			   <b>索引:</b>0 &nbsp;&nbsp;&nbsp;
			   <b>属性:</b>class &nbsp;&nbsp;&nbsp;
			   <b>值:</b>aligncenter </code>
			   <br>
			   </span>
        </p>
        <br>
        <code style="margin-left:15px;">PS: 如果 <b>索引</b> 是 <b>0</b> 为找到所有匹配的元素; <b> 1 </b> 为找到第1个匹配的元素; <b> -1 </b> 为找到最后1个匹配的元素</code>
    </div>

    <div class="customstyle-list layui-hide"></div>
    <?php
         $customstyle = CTspider_html('ctspider_task','customstyle');
        if (!empty($customstyle['style'])) :
        $style = $customstyle['style'];
        foreach ($style['selector'] as $key => $value) :
    ?>
    <div class="layui-form-item customstyle-list" style="position: relative;">
        <div class="layui-input-inline" style="width: 20%;margin-left:15px;">
            <div class="layui-form-mid layui-word-aux">HTML标签 或 CSS 选择器</div>
            <input type="text" value="<?php echo $value; ?>" name="style[a][selector][<?php echo $key ?>]" ct-filter="customstyle-selector" lay-verify="required" lay-verType="tips" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 5%;">
            <div class="layui-form-mid layui-word-aux">索引</div>
            <input type="text" value="<?php echo $style['index'][$key]; ?>" name="style[a][index][<?php echo $key ?>]" ct-filter="customstyle-index" lay-verify="required|number" lay-verType="tips" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 15%;">
            <div class="layui-form-mid layui-word-aux">属性</div>
            <input type="text" value="<?php echo $style['attr'][$key]; ?>" name="style[a][attr][<?php echo $key ?>]" ct-filter="customstyle-attr" lay-verify="required" lay-verType="tips" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 50%;">
            <div class="layui-form-mid layui-word-aux">值</div>
            <input type="text" value="<?php echo $style['value'][$key]; ?>" name="style[a][value][<?php echo $key ?>]" ct-filter="customstyle-value" lay-verify="required" lay-verType="tips" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="position:absolute; bottom: 0px;">
            <button type="button" ct-reset="custom_style" class="layui-btn layui-btn-danger rule-delete">删除</button>
        </div>
    </div>
    <?php endforeach; endif; ?>

    <div class="layui-form-item" style="padding-left:15px;">
        <a class="layui-btn layui-btn-sm layui-btn-warm add-custom-style" title="">新增</a>
    </div>
    <br><br>
    <hr>


    <button type="button" class="layui-btn" lay-submit lay-filter="customstyle" >保存更改</button>
</form>