82 lines
2.1 KiB
PHP
82 lines
2.1 KiB
PHP
{include file="public/header" /}
|
|
<style type="text/css">
|
|
ul {
|
|
display: block;
|
|
list-style-type: disc;
|
|
margin-block-start: 1em;
|
|
margin-block-end: 1em;
|
|
margin-inline-start: 0px;
|
|
margin-inline-end: 0px;
|
|
/* padding-inline-start: 40px; */
|
|
}
|
|
.site-doc-icon {
|
|
margin-bottom: 50px;
|
|
font-size: 0;
|
|
}
|
|
li {
|
|
list-style: none;
|
|
}
|
|
.site-doc-icon li {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
width: 132px;
|
|
height: 105px;
|
|
line-height: 25px;
|
|
padding: 20px 0;
|
|
margin-right: -1px;
|
|
margin-bottom: -1px;
|
|
border: 1px solid #e2e2e2;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
color: #666;
|
|
transition: all .3s;
|
|
-webkit-transition: all .3s;
|
|
}
|
|
.site-doc-icon li .layui-icon {
|
|
display: inline-block;
|
|
font-size: 36px;
|
|
}
|
|
.site-doc-icon li .doc-icon-name, .site-doc-icon li .doc-icon-code {
|
|
color: #c2c2c2;
|
|
}
|
|
.site-doc-icon li .doc-icon-fontclass {
|
|
height: 40px;
|
|
line-height: 20px;
|
|
padding: 0 5px;
|
|
font-size: 13px;
|
|
color: #333;
|
|
}
|
|
</style>
|
|
<div class="header" style="margin-bottom:20px;">
|
|
<span>图标</span>
|
|
<div></div>
|
|
</div>
|
|
<pre id="pre" class="layui-code">
|
|
<!-- 图标 -->
|
|
<i class="layui-icon layui-icon-face-smile"></i>
|
|
<!-- 图标，设置颜色、大小 -->
|
|
<i class="layui-icon layui-icon-face-smile" style="font-size:30px;color:#1E9FFF;"></i>
|
|
<!-- 图标，设置旋转 -->
|
|
<i class="layui-icon layui-icon-face-smile layui-anim layui-anim-rotate layui-anim-loop"></i>
|
|
</pre>
|
|
<ul class="site-doc-icon" style="text-align: center;">
|
|
{foreach($lists as $lists_v)}
|
|
<li>
|
|
<i class="layui-icon {$lists_v['icon_css']} {if($lists_v['icon_name']=='loading')} layui-anim layui-anim-rotate layui-anim-loop{/if}"></i>
|
|
<div class="doc-icon-name">{$lists_v['icon_name']}</div>
|
|
<div class="doc-icon-code">{$lists_v['icon_html']}</div>
|
|
<div class="doc-icon-fontclass">{$lists_v['icon_css']}</div>
|
|
</li>
|
|
{/foreach}
|
|
</ul>
|
|
<script type="text/javascript">
|
|
layui.use('code', function(){
|
|
layui.code({
|
|
elem:'#pre'
|
|
,title: '使用方法'
|
|
,encode: true
|
|
,skin: 'notepad' //如果要默认风格，不用设定该key。
|
|
});
|
|
});
|
|
</script>
|
|
{include file="public/tail" /} |