Card

普通卡片

<div class="layui-tabs layui-tabs-card" lay-options="{index: 1}"> <ul class="layui-tabs-header"> <li>标题1</li> <li>标题2</li> <li><a href="" target="_blank" class="layui-font-blue">跳转项</a></li> <li class="layui-disabled" lay-unselect>禁选项</li> <li>标题5</li> <li>标题6</li> </ul> <div class="layui-tabs-body"> <div class="layui-tabs-item">内容-1</div> <div class="layui-tabs-item">内容-2</div> <div class="layui-tabs-item">内容-3</div> <div class="layui-tabs-item">内容-4</div> <div class="layui-tabs-item">内容-5</div> <div class="layui-tabs-item">内容-6</div> </div> </div>

边框卡片

<div class="layui-tabs layui-tabs-card layui-panel layui-inline"> <ul class="layui-tabs-header layui-bg-tint"> <li class="layui-this">标题1</li> <li>标题2</li> <li>标题3</li> <li>标题4</li> <li>标题5</li> <li>标题6</li> </ul> <div class="layui-tabs-body"> <div class="layui-tabs-item layui-show"> <div class="layui-form"> <select> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> </select> </div> </div> <div class="layui-tabs-item">2</div> <div class="layui-tabs-item">3</div> <div class="layui-tabs-item">4</div> <div class="layui-tabs-item">5</div> <div class="layui-tabs-item">6</div> </div> </div> <!-- import layui -->