chore: 教程优化

This commit is contained in:
xiaojunnuo
2024-10-30 17:50:38 +08:00
parent d282045683
commit f92935d93f
27 changed files with 150 additions and 103 deletions
@@ -6,9 +6,9 @@
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href='demo.css'>
<link rel="stylesheet" href='iconfont.css'>
<script src='iconfont.js'></script>
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
<script src="iconfont.js"></script>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
@@ -38,7 +38,7 @@
<div class="main">
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
</a></h1>
<div class="nav-tabs">
<ul id="tabs" class="dib-box">
@@ -46,44 +46,50 @@
<li class="dib"><span>Font class</span></li>
<li class="dib"><span>Symbol</span></li>
</ul>
<a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=4688792" target="_blank" class="nav-more">查看项目</a>
</div>
<div class="tab-container">
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe610;</span>
<div class="name">华为</div>
<div class="code-name">&amp;#xe610;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe603;</span>
<div class="name">qiniuyun</div>
<div class="code-name">&amp;#xe603;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe601;</span>
<div class="name">aliyun</div>
<div class="code-name">&amp;#xe601;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe747;</span>
<div class="name">腾讯云</div>
<div class="code-name">&amp;#xe747;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe605;</span>
<div class="name">doge</div>
<div class="code-name">&amp;#xe605;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe600;</span>
<div class="name">bt</div>
<div class="code-name">&amp;#xe600;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
@@ -102,7 +108,7 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.svg?t=1727153857332#iconfont') format('svg');
src: url('iconfont.svg?t=1730278432006#iconfont') format('svg');
}
</code></pre>
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
@@ -127,7 +133,16 @@
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-huawei"></span>
<div class="name">
华为
</div>
<div class="code-name">.icon-huawei
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-qiniuyun"></span>
<div class="name">
@@ -136,7 +151,7 @@
<div class="code-name">.icon-qiniuyun
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-aliyun"></span>
<div class="name">
@@ -145,7 +160,7 @@
<div class="code-name">.icon-aliyun
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tencentcloud"></span>
<div class="name">
@@ -154,7 +169,7 @@
<div class="code-name">.icon-tencentcloud
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dogecloud"></span>
<div class="name">
@@ -163,7 +178,7 @@
<div class="code-name">.icon-dogecloud
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-bt"></span>
<div class="name">
@@ -172,7 +187,7 @@
<div class="code-name">.icon-bt
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
@@ -199,7 +214,15 @@
</div>
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-huawei"></use>
</svg>
<div class="name">华为</div>
<div class="code-name">#icon-huawei</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-qiniuyun"></use>
@@ -207,7 +230,7 @@
<div class="name">qiniuyun</div>
<div class="code-name">#icon-qiniuyun</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-aliyun"></use>
@@ -215,7 +238,7 @@
<div class="name">aliyun</div>
<div class="code-name">#icon-aliyun</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tencentcloud"></use>
@@ -223,7 +246,7 @@
<div class="name">腾讯云</div>
<div class="code-name">#icon-tencentcloud</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dogecloud"></use>
@@ -231,7 +254,7 @@
<div class="name">doge</div>
<div class="code-name">#icon-dogecloud</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-bt"></use>
@@ -239,7 +262,7 @@
<div class="name">bt</div>
<div class="code-name">#icon-bt</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>