Commit 8a3dde66 by LJM

initial

parent 1f71fb16
......@@ -132,3 +132,8 @@ body {
.verCenter {
align-items: center;
}
.main {
width: 1280px;
margin: 0 auto;
}
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时,垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<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>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
<style>
.main .logo {
margin-top: 0;
height: auto;
}
.main .logo a {
display: flex;
align-items: center;
}
.main .logo .sub-title {
margin-left: 0.5em;
font-size: 22px;
color: #fff;
background: linear-gradient(-45deg, #3967FF, #B500FE);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
<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">
<li class="dib active"><span>Unicode</span></li>
<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=4497966" 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">&#xe7b0;</span>
<div class="name">多语言</div>
<div class="code-name">&amp;#xe7b0;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a9;</span>
<div class="name">qq</div>
<div class="code-name">&amp;#xe7a9;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7aa;</span>
<div class="name">芯片备份</div>
<div class="code-name">&amp;#xe7aa;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7ab;</span>
<div class="name">客服</div>
<div class="code-name">&amp;#xe7ab;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7ac;</span>
<div class="name">服务</div>
<div class="code-name">&amp;#xe7ac;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7ad;</span>
<div class="name">芯片</div>
<div class="code-name">&amp;#xe7ad;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7ae;</span>
<div class="name">微信</div>
<div class="code-name">&amp;#xe7ae;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7af;</span>
<div class="name">箭头_下一页</div>
<div class="code-name">&amp;#xe7af;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a1;</span>
<div class="name">芯片备份 6</div>
<div class="code-name">&amp;#xe7a1;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a2;</span>
<div class="name">芯片备份 3</div>
<div class="code-name">&amp;#xe7a2;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a3;</span>
<div class="name">芯片备份 2</div>
<div class="code-name">&amp;#xe7a3;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a0;</span>
<div class="name">保障</div>
<div class="code-name">&amp;#xe7a0;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a4;</span>
<div class="name">芯片备份 7</div>
<div class="code-name">&amp;#xe7a4;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a5;</span>
<div class="name">芯片备份 4</div>
<div class="code-name">&amp;#xe7a5;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a6;</span>
<div class="name">火箭</div>
<div class="code-name">&amp;#xe7a6;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a7;</span>
<div class="name">销售含金额</div>
<div class="code-name">&amp;#xe7a7;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a8;</span>
<div class="name">芯片备份 5</div>
<div class="code-name">&amp;#xe7a8;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
<hr>
<p>Unicode 是字体在网页端最原始的应用方式,特点是:</p>
<ul>
<li>支持按字体的方式去动态调整图标大小,颜色等等。</li>
<li>默认情况下不支持多色,直接添加多色图标会自动去色。</li>
</ul>
<blockquote>
<p>注意:新版 iconfont 支持两种方式引用多色图标:SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)</p>
</blockquote>
<p>Unicode 使用步骤如下:</p>
<h3 id="-font-face">第一步:拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1712542359775') format('woff2'),
url('iconfont.woff?t=1712542359775') format('woff'),
url('iconfont.ttf?t=1712542359775') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取字体编码,应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-duoyuyan"></span>
<div class="name">
多语言
</div>
<div class="code-name">.icon-duoyuyan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-qq"></span>
<div class="name">
qq
</div>
<div class="code-name">.icon-qq
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinpianbeifen"></span>
<div class="name">
芯片备份
</div>
<div class="code-name">.icon-xinpianbeifen
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-kefu"></span>
<div class="name">
客服
</div>
<div class="code-name">.icon-kefu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-fuwu"></span>
<div class="name">
服务
</div>
<div class="code-name">.icon-fuwu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinpian"></span>
<div class="name">
芯片
</div>
<div class="code-name">.icon-xinpian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-weixin"></span>
<div class="name">
微信
</div>
<div class="code-name">.icon-weixin
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiantou_xiayiye"></span>
<div class="name">
箭头_下一页
</div>
<div class="code-name">.icon-jiantou_xiayiye
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen6"></span>
<div class="name">
芯片备份 6
</div>
<div class="code-name">.icon-a-xinpianbeifen6
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen3"></span>
<div class="name">
芯片备份 3
</div>
<div class="code-name">.icon-a-xinpianbeifen3
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen2"></span>
<div class="name">
芯片备份 2
</div>
<div class="code-name">.icon-a-xinpianbeifen2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-baozhang"></span>
<div class="name">
保障
</div>
<div class="code-name">.icon-baozhang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen7"></span>
<div class="name">
芯片备份 7
</div>
<div class="code-name">.icon-a-xinpianbeifen7
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen4"></span>
<div class="name">
芯片备份 4
</div>
<div class="code-name">.icon-a-xinpianbeifen4
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-huojian"></span>
<div class="name">
火箭
</div>
<div class="code-name">.icon-huojian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiaoshouhanjine"></span>
<div class="name">
销售含金额
</div>
<div class="code-name">.icon-xiaoshouhanjine
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xinpianbeifen5"></span>
<div class="name">
芯片备份 5
</div>
<div class="code-name">.icon-a-xinpianbeifen5
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
<hr>
<p>font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。</p>
<p>与 Unicode 使用方式相比,具有如下特点:</p>
<ul>
<li>相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。</li>
<li>因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-fontclass-">第一步:引入项目下面生成的 fontclass 代码:</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
<h3 id="-">第二步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"
iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
</blockquote>
</div>
</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-duoyuyan"></use>
</svg>
<div class="name">多语言</div>
<div class="code-name">#icon-duoyuyan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-qq"></use>
</svg>
<div class="name">qq</div>
<div class="code-name">#icon-qq</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinpianbeifen"></use>
</svg>
<div class="name">芯片备份</div>
<div class="code-name">#icon-xinpianbeifen</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-kefu"></use>
</svg>
<div class="name">客服</div>
<div class="code-name">#icon-kefu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-fuwu"></use>
</svg>
<div class="name">服务</div>
<div class="code-name">#icon-fuwu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinpian"></use>
</svg>
<div class="name">芯片</div>
<div class="code-name">#icon-xinpian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-weixin"></use>
</svg>
<div class="name">微信</div>
<div class="code-name">#icon-weixin</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiantou_xiayiye"></use>
</svg>
<div class="name">箭头_下一页</div>
<div class="code-name">#icon-jiantou_xiayiye</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen6"></use>
</svg>
<div class="name">芯片备份 6</div>
<div class="code-name">#icon-a-xinpianbeifen6</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen3"></use>
</svg>
<div class="name">芯片备份 3</div>
<div class="code-name">#icon-a-xinpianbeifen3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen2"></use>
</svg>
<div class="name">芯片备份 2</div>
<div class="code-name">#icon-a-xinpianbeifen2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-baozhang"></use>
</svg>
<div class="name">保障</div>
<div class="code-name">#icon-baozhang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen7"></use>
</svg>
<div class="name">芯片备份 7</div>
<div class="code-name">#icon-a-xinpianbeifen7</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen4"></use>
</svg>
<div class="name">芯片备份 4</div>
<div class="code-name">#icon-a-xinpianbeifen4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-huojian"></use>
</svg>
<div class="name">火箭</div>
<div class="code-name">#icon-huojian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiaoshouhanjine"></use>
</svg>
<div class="name">销售含金额</div>
<div class="code-name">#icon-xiaoshouhanjine</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xinpianbeifen5"></use>
</svg>
<div class="name">芯片备份 5</div>
<div class="code-name">#icon-a-xinpianbeifen5</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>
<hr>
<p>这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:</p>
<ul>
<li>支持多色图标了,不再受单色限制。</li>
<li>通过一些技巧,支持像字体那样,通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
<li>兼容性较差,支持 IE9+,及现代浏览器。</li>
<li>浏览器渲染 SVG 的性能一般,还不如 png。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-symbol-">第一步:引入项目下面生成的 symbol 代码:</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
<h3 id="-css-">第二步:加入通用 CSS 代码(引入一次就行):</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
&lt;/style&gt;
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
&lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.tab-container .content:first').show()
$('#tabs li').click(function (e) {
var tabContent = $('.tab-container .content')
var index = $(this).index()
if ($(this).hasClass('active')) {
return
} else {
$('#tabs li').removeClass('active')
$(this).addClass('active')
tabContent.hide().eq(index).fadeIn()
}
})
})
</script>
</body>
</html>
@font-face {
font-family: "iconfont"; /* Project id 4497966 */
src: url('iconfont.woff2?t=1712542359775') format('woff2'),
url('iconfont.woff?t=1712542359775') format('woff'),
url('iconfont.ttf?t=1712542359775') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-duoyuyan:before {
content: "\e7b0";
}
.icon-qq:before {
content: "\e7a9";
}
.icon-xinpianbeifen:before {
content: "\e7aa";
}
.icon-kefu:before {
content: "\e7ab";
}
.icon-fuwu:before {
content: "\e7ac";
}
.icon-xinpian:before {
content: "\e7ad";
}
.icon-weixin:before {
content: "\e7ae";
}
.icon-jiantou_xiayiye:before {
content: "\e7af";
}
.icon-a-xinpianbeifen6:before {
content: "\e7a1";
}
.icon-a-xinpianbeifen3:before {
content: "\e7a2";
}
.icon-a-xinpianbeifen2:before {
content: "\e7a3";
}
.icon-baozhang:before {
content: "\e7a0";
}
.icon-a-xinpianbeifen7:before {
content: "\e7a4";
}
.icon-a-xinpianbeifen4:before {
content: "\e7a5";
}
.icon-huojian:before {
content: "\e7a6";
}
.icon-xiaoshouhanjine:before {
content: "\e7a7";
}
.icon-a-xinpianbeifen5:before {
content: "\e7a8";
}
window._iconfont_svg_string_4497966='<svg><symbol id="icon-duoyuyan" viewBox="0 0 1024 1024"><path d="M927.0784 512.1536c0-110.7968-43.1616-215.04-121.5488-293.376A412.16 412.16 0 0 0 517.2224 97.28a38.6048 38.6048 0 0 0-11.3664 0 412.16 412.16 0 0 0-287.1296 121.4976 412.16 412.16 0 0 0-121.4976 287.7952 38.5536 38.5536 0 0 0 0 9.5232 412.16 412.16 0 0 0 121.4464 289.4848 412.2624 412.2624 0 0 0 293.4272 121.5488 412.2624 412.2624 0 0 0 309.9648-139.0592 19.0976 19.0976 0 0 0 2.9184-3.328 411.8528 411.8528 0 0 0 102.0928-272.5888z m-617.0624 18.2784c1.2288 61.0304 8.6016 118.272 20.9408 169.3184-57.344 15.5136-93.7472 35.6864-112.5888 48.2304a374.9888 374.9888 0 0 1-82.688-217.6h174.336zM217.9072 276.9408c18.688 12.5952 55.0912 32.9728 112.8448 48.5888a793.4976 793.4976 0 0 0-20.6848 166.8096H135.68A374.9888 374.9888 0 0 1 217.9072 276.992z m496.2816 215.3984a793.4464 793.4464 0 0 0-20.6848-166.7584c57.6-15.5648 94.1568-35.7888 113.0496-48.384a374.9888 374.9888 0 0 1 81.92 215.1424H714.24z m-38.0928 0h-145.5104V347.2384c48.5376-1.024 90.2656-5.9904 125.7984-13.0048 11.6736 48.4352 18.432 102.144 19.712 158.1056z m-145.5104-354.4064c34.304 9.6768 67.6864 45.7216 93.8496 102.2976 8.192 17.664 15.4624 36.864 21.8112 57.1904-32.5632 6.2976-70.9632 10.752-115.6608 11.776V137.9328z m-38.0928 171.2128a679.5264 679.5264 0 0 1-114.432-11.8784c6.2976-20.2752 13.568-39.424 21.76-57.0368 25.856-55.9616 58.88-91.8528 92.672-101.9904v170.9056z m0 183.1936H348.16c1.3312-55.9616 8.0896-109.6704 19.7632-158.1568 35.1744 7.0144 76.544 11.9808 124.6208 13.056v145.1008z m0 38.0928v147.5072c-47.9744 1.1264-89.2416 6.144-124.416 13.1072a755.3536 755.3536 0 0 1-19.968-160.6144h144.384z m0 355.6864c-33.792-10.1376-66.816-46.08-92.672-101.9904a466.7904 466.7904 0 0 1-21.504-56.32c32.1536-6.2464 70.0928-10.752 114.176-11.776v170.0864z m38.0928-170.1376c44.544 0.9216 82.8416 5.4272 115.4048 11.776-6.2976 20.0192-13.4656 38.912-21.5552 56.3712-26.1632 56.5248-59.5968 92.672-93.8496 102.2976v-170.496z m0-185.5488h145.5616a755.5584 755.5584 0 0 1-19.968 160.3584 722.7392 722.7392 0 0 0-125.5936-12.9024v-147.456z m357.9904 0a374.9888 374.9888 0 0 1-82.432 217.2416c-18.9952-12.7488-55.4496-32.8704-112.7936-48.2304 12.288-50.944 19.6608-108.0832 20.8896-169.0112h174.336z m-107.52-282.0096c-17.0496 10.752-48.64 27.2896-97.536 40.448-17.92-58.6752-42.8544-106.9568-72.5504-140.3904a377.088 377.088 0 0 1 170.0864 99.9424z m-440.32 40.1408c-48.64-13.2096-80.2816-29.7984-97.1776-40.4992A377.088 377.088 0 0 1 413.2864 148.48c-29.696 33.3824-54.5792 81.6128-72.4992 140.0832z m-96.768 488.192c16.9984-10.752 48.4352-27.1872 97.024-40.2944 17.92 58.2144 42.752 106.1376 72.2944 139.4176a377.088 377.088 0 0 1-169.3184-99.1232z m439.296-40.448c48.3328 13.056 79.9744 29.44 97.2288 40.192a377.088 377.088 0 0 1-169.5232 99.3792c29.5424-33.28 54.3744-81.3056 72.2944-139.52z" fill="#FFFFFF" opacity=".8" ></path></symbol><symbol id="icon-qq" viewBox="0 0 1024 1024"><path d="M238.222222 470.101333c-2.332444-5.888-3.498667-13.937778-3.498666-24.177777 0-6.200889 1.592889-13.824 4.807111-22.812445 3.214222-8.988444 6.712889-15.985778 10.496-20.935111a86.471111 86.471111 0 0 1 3.271111-24.661333c2.474667-9.642667 5.774222-16.298667 9.841778-20.024889 0-43.121778 13.482667-87.893333 40.448-134.257778 26.993778-46.364444 58.680889-78.876444 95.146666-97.507556 40.504889-20.48 87.751111-30.72 141.681778-30.72 38.798222 0 77.568 8.533333 116.337778 25.6 14.307556 6.542222 27.420444 13.966222 39.367111 22.357334 11.946667 8.362667 22.300444 17.066667 31.061333 26.055111 8.732444 8.988444 16.782222 19.541333 24.064 31.630222 7.281778 12.117333 13.397333 23.608889 18.346667 34.446222 4.977778 10.865778 9.699556 23.978667 14.222222 39.338667 4.522667 15.36 8.248889 29.240889 11.150222 41.642667 2.929778 12.401778 6.115556 27.591111 9.614223 45.596444l0.455111 2.332445c16.042667 25.742222 24.064 49.038222 24.064 69.802666 0 4.352-1.336889 10.552889-3.953778 18.631111-2.616889 8.049778-3.925333 13.937778-3.925333 17.664 0 0.312889 0.199111 0.853333 0.654222 1.649778a21.333333 21.333333 0 0 0 1.536 2.332445c0.568889 0.768 0.853333 1.308444 0.853333 1.621333 22.471111 35.356444 40.021333 68.636444 52.707556 99.84a255.175111 255.175111 0 0 1 19.029333 96.995555c0 13.368889-2.844444 28.871111-8.533333 46.563556-5.688889 17.664-13.767111 26.510222-24.263111 26.510222a14.449778 14.449778 0 0 1-8.533334-3.470222 47.075556 47.075556 0 0 1-8.305778-8.163556 124.273778 124.273778 0 0 1-8.305777-12.088888 155.363556 155.363556 0 0 1-6.997334-12.344889 2356.622222 2356.622222 0 0 1-9.841777-20.224c-0.284444-0.312889-0.739556-0.483556-1.308445-0.483556l-2.190222 1.877333c-17.208889 47.786667-36.465778 82.375111-57.742222 103.765334 5.831111 6.200889 14.791111 12.174222 26.908444 17.92 12.088889 5.745778 22.158222 12.174222 30.151111 19.342222 8.049778 7.111111 13.198222 17.208889 15.559111 30.236444-0.597333 1.223111-1.194667 3.697778-1.763555 7.424a18.176 18.176 0 0 1-3.072 8.391112c-18.659556 30.094222-62.691556 45.141333-132.067556 45.141333-15.445333 0-31.573333-1.422222-48.355555-4.181333a384.227556 384.227556 0 0 1-42.837334-9.329778c-11.804444-3.413333-27.022222-8.049778-45.710222-13.937778a141.795556 141.795556 0 0 0-10.040889-3.271111c-4.096-1.251556-10.808889-1.934222-20.138666-2.104889a214.101333 214.101333 0 0 1-17.493334-0.682667c-11.946667 13.937778-30.520889 24.035556-55.751111 30.236445-25.230222 6.229333-49.777778 9.329778-73.699555 9.329778-10.211556 0-20.252444-0.256-30.151112-0.711112a495.075556 495.075556 0 0 1-40.675555-4.181333 249.941333 249.941333 0 0 1-44.202667-9.557333 92.188444 92.188444 0 0 1-32.568889-18.602667c-9.500444-8.362667-14.222222-18.318222-14.222222-29.781333 0-12.401778 1.450667-21.617778 4.380445-27.704889 2.901333-6.030222 8.874667-13.568 17.92-22.556445a122.595556 122.595556 0 0 0 17.720888-6.058666c8.590222-3.413333 15.815111-5.262222 21.617778-5.575111 1.194667 0 3.242667-0.312889 6.144-0.938667 0.568889-0.625778 0.853333-1.251556 0.853334-1.848889l-0.853334-1.422222c-13.994667-3.413333-29.724444-19.768889-47.217778-49.066667-17.493333-29.326222-28.16-53.617778-31.943111-72.846222l-2.190222-1.422222c-1.137778 0-2.901333 3.128889-5.233778 9.329778a103.424 103.424 0 0 1-23.836444 34.673777c-10.638222 10.382222-21.959111 16.213333-33.905778 17.464889h-0.426667c-1.166222 0-2.048-0.711111-2.616888-2.104889-0.597333-1.422222-1.336889-2.275556-2.190223-2.56-6.712889-16.782222-10.069333-32.256-10.069333-46.535111 0-85.333333 36.750222-157.610667 110.222222-216.888889z" fill="#0D8DDA" ></path></symbol><symbol id="icon-xinpianbeifen" viewBox="0 0 1024 1024"><path d="M796.412916 266.202988v-79.723952A81.611566 81.611566 0 0 0 714.789012 104.86747H307.298699a81.611566 81.611566 0 0 0-81.611566 81.611566v79.723952H123.373494a81.611566 81.611566 0 0 0-81.611566 81.611566v440.455711a81.611566 81.611566 0 0 0 81.623903 81.623904h60.119904a20.677398 20.677398 0 0 0 0 4.342747v17.691759a27.203855 27.203855 0 1 0 54.407711 0V874.224578a20.677398 20.677398 0 0 0 0-4.342747h545.693301a20.677398 20.677398 0 0 0 0 4.342747v17.691759a27.203855 27.203855 0 1 0 54.407711 0V874.224578a20.405976 20.405976 0 0 0 0-4.342747h62.575036a81.611566 81.611566 0 0 0 81.623904-81.623903V347.814554a81.636241 81.636241 0 0 0-83.523856-81.611566h-102.288964z m-54.407711 273.950843H537.168193V159.275181h177.620819c15.026892 0 27.203855 12.189301 27.203855 27.203855v353.674795zM307.286361 159.275181H482.760482v380.87865H280.094843V186.479036c0-15.014554 12.176964-27.203855 27.203856-27.203855zM925.918072 788.270265a27.203855 27.203855 0 0 1-27.203855 27.203855H123.398169a27.203855 27.203855 0 0 1-27.216193-27.203855V347.814554a27.203855 27.203855 0 0 1 27.216193-27.203855h102.276626v221.455421h-38.344482a27.203855 27.203855 0 0 0 0 54.407711h649.623133a27.203855 27.203855 0 0 0 0-54.407711h-40.54053v-221.455421h102.288964a27.203855 27.203855 0 0 1 27.203855 27.203855v440.455711z" fill="#0D8DDA" ></path></symbol><symbol id="icon-kefu" viewBox="0 0 1024 1024"><path d="M506.652444 135.111111c150.243556 0 275.626667 105.927111 308.423112 247.921778 0.512 0 0.910222-0.085333 1.422222-0.085333 33.564444 0 60.672 26.965333 60.501333 60.245333v118.727111a60.017778 60.017778 0 0 1-37.148444 55.552c-24.689778 136.248889-143.018667 223.971556-290.56 235.946667a51.968 51.968 0 0 1-49.493334 35.470222c-28.785778 0-52.224-22.840889-52.224-50.972445 0-28.16 23.438222-51.000889 52.252445-51.000888a52.252444 52.252444 0 0 1 48.526222 32.426666c127.516444-10.837333 230.485333-83.143111 255.772444-198.513778a60.928 60.928 0 0 1-38.115555-25.457777 274.005333 274.005333 0 0 1-128.483556 156.245333c-0.853333 0.512-1.706667 1.024-2.56 1.422222a2.332444 2.332444 0 0 1-1.080889 0.284445l-1.166222-0.284445-1.507555-0.654222a4.693333 4.693333 0 0 1-2.190223-3.982222c0-1.251556 0.483556-2.446222 1.336889-3.356445l0.256-0.256c59.904-54.869333 63.544889-108.458667 56.945778-186.737777-5.717333-68.437333-45.738667-133.404444-65.991111-162.702223l-1.422222 0.824889a6.314667 6.314667 0 0 0-5.034667-2.616889c-3.128889 0-5.745778 2.275556-6.257778 5.319111-2.104889 20.195556-6.741333 34.304-9.955555 41.272889-13.539556 29.752889-35.783111 47.701333-68.408889 53.617778-51.2 9.329778-102.200889 20.195556-153.457778 29.724445-31.914667 5.916444-59.306667 41.898667-54.016 78.478222 12.231111 83.171556 68.437333 142.648889 84.024889 154.282666a5.034667 5.034667 0 0 0-2.844444-0.938666c-1.024 0-2.218667 1.194667-3.299556 2.56-1.109333 1.507556-2.104889 3.100444-2.958222 4.778666A274.005333 274.005333 0 0 1 251.477333 608.711111c-10.780444 13.312-27.022222 21.987556-45.425777 21.987556a59.392 59.392 0 0 1-59.050667-59.676445v-117.560889a59.392 59.392 0 0 1 48.64-58.624c28.387556-147.911111 156.643556-259.726222 311.011555-259.726222z m93.838223 522.638222l1.536 0.426667c2.56 1.166222 3.697778 3.953778 2.872889 6.542222a94.151111 94.151111 0 0 1-89.486223 65.251556 95.288889 95.288889 0 0 1-80.042666-44.942222 5.404444 5.404444 0 0 1 1.080889-6.968889 5.489778 5.489778 0 0 1 7.082666 0.085333c0.170667 0.085333 17.692444 14.904889 56.888889 14.904889 8.078222 0 16.241778-0.568889 24.263111-1.706667 56.035556-7.566222 70.371556-30.72 70.542222-31.004444a5.376 5.376 0 0 1 6.826667-2.161778zM506.737778 187.107556c-130.958222 0-239.587556 95.971556-261.575111 222.208 2.275556 1.934222 4.380444 4.124444 6.4 6.4 38.769778-103.537778 138.211556-177.379556 255.004444-177.379556 117.304889 0 216.974222 74.496 255.488 178.744889 1.706667-3.384889 3.697778-6.570667 6.087111-9.614222-22.755556-125.297778-131.043556-220.359111-261.404444-220.359111z" fill="#0D8DDA" ></path></symbol><symbol id="icon-fuwu" viewBox="0 0 1024 1024"><path d="M636.707446 733.483323a37.116062 37.116062 0 0 1 37.116062 37.116062v37.116061h37.116061a37.116062 37.116062 0 0 1 37.116062 37.116062v103.928123a37.116062 37.116062 0 0 1-36.186585 37.116061H316.573538a37.116062 37.116062 0 0 1-37.131815-37.116061v-103.928123a37.116062 37.116062 0 0 1 37.131815-37.116062h37.116062v-37.116061a37.116062 37.116062 0 0 1 37.116062-37.116062h245.901784zM599.591385 807.699692H427.921723v37.116062a37.116062 37.116062 0 0 1-37.116061 37.116061H353.673846v29.696h321.063385v-29.696h-38.045539a37.116062 37.116062 0 0 1-37.116061-37.116061V807.699692zM855.481108 97.122462c78.580185 78.580185 78.674708 205.965785 0.220554 284.672l-80.061047 80.092553c-1.276062 1.858954-2.741169 3.623385-4.379569 5.277539L538.340431 699.139938a37.116062 37.116062 0 0 1-25.993846 11.13797H511.448615a37.131815 37.131815 0 0 1-25.993846-11.13797L168.093538 381.794462c-78.265108-78.737723-78.076062-205.965785 0.425354-284.4672 78.501415-78.501415 205.713723-78.690462 284.451446-0.4096l58.761847 58.7776 59.076923-58.7776c78.706215-78.469908 206.091815-78.375385 284.672 0.2048zM623.710523 148.873846L426.992246 345.592123a37.399631 37.399631 0 0 1-52.901415-52.885661l84.645415-84.25157-58.651569-58.651569a127.133538 127.133538 0 0 0-179.089723 179.089723l82.628923 82.880985c0.945231 0.787692 1.858954 1.606892 2.741169 2.489107l205.540431 205.540431 206.454154-205.540431 85.385846-85.370092c49.167754-49.183508 49.167754-129.906215 0-180.0192-49.199262-50.097231-129.921969-49.183508-180.034954 0z" fill="#FFFFFF" ></path></symbol><symbol id="icon-xinpian" viewBox="0 0 1024 1024"><path d="M697.862169 80.24212a30.966747 30.966747 0 0 1 30.966747 30.966747v62.130892c62.315952 10.079614 111.653012 59.466024 121.646265 121.818988h62.303614a30.966747 30.966747 0 0 1 0 61.933494h-60.428337v123.829976h60.428337a30.966747 30.966747 0 0 1 0 61.933494h-60.416v124.039711h60.428338a30.966747 30.966747 0 0 1 0 61.933494h-62.352964a147.456 147.456 0 0 1-121.596916 121.559903v62.402314a30.966747 30.966747 0 0 1-61.933494 0v-60.502362H543.065446v60.502362a30.966747 30.966747 0 0 1-61.933494 0v-60.502362H357.104578v60.502362a30.966747 30.966747 0 0 1-61.945831 0v-62.389976a147.468337 147.468337 0 0 1-121.744964-121.572241H111.208867a30.966747 30.966747 0 0 1 0-61.933494h60.292627V542.855711H111.208867a30.966747 30.966747 0 0 1 0-61.945831h60.292627V357.104578H111.208867a30.966747 30.966747 0 0 1 0-61.933494h62.167904c10.00559-62.426988 59.392-111.825735 121.781976-121.868337V111.208867a30.966747 30.966747 0 0 1 61.933494 0v60.218603h124.027373v-60.206265a30.966747 30.966747 0 0 1 61.945832 0v60.206265h123.817638v-60.206265a30.966747 30.966747 0 0 1 30.966747-30.979085z m7.377735 153.131181H318.624386a85.275759 85.275759 0 0 0-85.177061 85.17706v386.615519a85.275759 85.275759 0 0 0 85.177061 85.17706h386.60318a85.275759 85.275759 0 0 0 85.177061-85.17706V318.550361a85.275759 85.275759 0 0 0-85.164723-85.17706z m-130.775904 124.064386c51.224675 0 92.912578 41.700241 92.900241 92.924915v124.027374c0 51.224675-41.675566 92.912578-92.900241 92.912578H450.411952c-51.224675 0-92.912578-41.687904-92.912579-92.912578V450.362602c0-51.237012 41.687904-92.924916 92.912579-92.924915z m0 61.945831H450.411952a31.003759 31.003759 0 0 0-30.966747 30.966747v124.039711a31.003759 31.003759 0 0 0 30.966747 30.966747h124.039711a31.016096 31.016096 0 0 0 30.966747-30.966747V450.362602a31.003759 31.003759 0 0 0-30.966747-30.966747z" fill="#0D8DDA" ></path></symbol><symbol id="icon-weixin" viewBox="0 0 1024 1024"><path d="M686.051556 389.319111c138.752 0 262.4 100.636444 262.4 224.170667 0 69.660444-46.193778 131.356444-108.231112 177.891555l23.267556 77.169778-84.707556-46.364444c-30.890667 7.68-61.952 15.502222-92.728888 15.502222-147.000889 0-262.769778-100.465778-262.769778-224.199111 0-123.448889 115.768889-224.142222 262.769778-224.142222zM384.512 157.525333c151.893333 0 285.013333 92.501333 311.751111 216.917334a257.393778 257.393778 0 0 0-29.724444-1.820445c-146.773333 0-262.684444 109.539556-262.684445 244.565334 0 22.471111 3.498667 44.088889 9.528889 64.739555a350.72 350.72 0 0 1-28.871111 1.223111c-38.599111 0-69.575111-7.879111-108.231111-15.473778l-107.975111 54.158223 30.890666-92.928c-77.368889-54.072889-123.648-123.733333-123.648-208.611556 0-147.000889 139.121778-262.769778 308.963556-262.769778z m220.245333 351.687111a34.986667 34.986667 0 1 0 0 69.973334 34.986667 34.986667 0 0 0 0-69.973334z m170.012445-0.284444a34.986667 34.986667 0 1 0 0 69.973333 34.986667 34.986667 0 0 0 0-69.973333zM280.746667 285.582222a42.012444 42.012444 0 1 0 0 84.024889 42.012444 42.012444 0 0 0 0-84.024889z m215.779555 0a42.012444 42.012444 0 1 0 0 84.024889 42.012444 42.012444 0 0 0 0-84.024889z" fill="#0D8DDA" ></path></symbol><symbol id="icon-jiantou_xiayiye" viewBox="0 0 1024 1024"><path d="M490.666667 507.733333L230.4 768 170.666667 708.266667l320-320L810.666667 708.266667 750.933333 768l-260.266666-260.266667zM170.666667 345.6v-85.333333h640v85.333333H170.666667z" fill="#0D8DDA" ></path></symbol><symbol id="icon-a-xinpianbeifen6" viewBox="0 0 1024 1024"><path d="M352.107952 598.879614a75.257831 75.257831 0 0 1 75.17147 75.183808c0 41.391807-33.767325 75.17147-75.17147 75.17147-41.391807 0-75.257831-33.680964-75.257832-75.17147s33.767325-75.183807 75.257832-75.183808m0-58.108915c-73.629301 0-133.366747 59.663422-133.366747 133.292723s59.651084 133.268048 133.280385 133.268048c73.629301 0 133.280386-59.638747 133.280386-133.268048S425.737253 540.783036 352.107952 540.783036z m87.607518-96.774169c23.700048 5.995952 50.755855 21.701398 67.830747 39.134072-15.17494 46.117012-5.268048 78.625928 5.798554 97.773494 11.07894 19.159904 34.236145 44.044337 81.710265 53.938892 6.637494 23.514988 6.637494 54.827181 0 78.342169-47.47412 9.894554-70.717687 34.778988-81.710265 53.926554-11.066602 19.159904-21.059855 51.668819-5.798554 97.785831-17.074892 17.519036-44.21706 33.13812-67.830747 39.134072-32.323855-36.234795-65.449639-43.859277-87.595181-43.859277-22.15788 0-55.296 7.624482-87.619855 43.859277-23.687711-5.995952-50.755855-21.713735-67.81841-39.134072 15.162602-46.117012 5.268048-78.625928-5.810891-97.785831-11.07894-19.147566-34.223807-44.032-81.710266-53.914217-6.625157-23.527325-6.625157-54.839518 0-78.354506 47.486458-9.906892 70.717687-34.778988 81.710266-53.938892 11.07894-19.147566 21.059855-51.656482 5.798554-97.773494 17.074892-17.519036 44.229398-33.13812 67.830747-39.134072 32.323855 36.222458 65.461976 43.859277 87.607518 43.859277 22.15788 0 55.197301-7.636819 87.607518-43.859277m-0.271422-58.195277c-16.161928 0-31.867373 6.908916-42.847614 19.246265-14.619759 16.433349-29.51094 24.613012-44.389783 24.613012-14.891181 0-29.88106-8.179663-44.402121-24.613012a57.294651 57.294651 0 0 0-56.751807-17.519036c-34.39653 8.636145-71.717012 30.140145-96.317687 55.653783a57.430361 57.430361 0 0 0-13.163952 57.923855c13.891855 41.675566-1.357108 68.102169-44.40212 76.985061a57.294651 57.294651 0 0 0-43.575518 40.318458c-9.808193 34.137446-9.808193 77.17012 0 111.307566a57.294651 57.294651 0 0 0 43.575518 40.30612c43.045012 8.808867 58.293976 35.223133 44.40212 76.985061a57.245301 57.245301 0 0 0 13.163952 57.923855c24.699373 25.513639 61.921157 47.029976 96.330024 55.653783 4.540145 1.159711 9.203663 1.727229 13.891856 1.727229 16.161928 0 31.867373-6.908916 42.847614-19.246265 14.619759-16.433349 29.51094-24.600675 44.402121-24.600675 14.878843 0 29.856386 8.167325 44.389783 24.600675a57.294651 57.294651 0 0 0 56.751807 17.519036c34.39653-8.623807 71.717012-30.140145 96.317687-55.641446a57.430361 57.430361 0 0 0 13.163952-57.936192c-13.891855-41.663229 1.357108-68.089831 44.40212-76.985061a57.294651 57.294651 0 0 0 43.575518-40.30612c9.808193-34.137446 9.808193-77.17012 0-111.307566a57.294651 57.294651 0 0 0-43.575518-40.318458c-43.045012-8.79653-58.293976-35.223133-44.40212-76.985061a57.245301 57.245301 0 0 0-13.163952-57.923855c-24.699373-25.513639-61.921157-47.029976-96.330024-55.653783a56.653108 56.653108 0 0 0-13.891856-1.727229z m252.212434-160.693976a32.53359 32.53359 0 0 1 32.508916 32.508916 32.669301 32.669301 0 0 1-32.508916 32.58294 32.669301 32.669301 0 0 1-32.595277-32.496579 32.693976 32.693976 0 0 1 32.595277-32.595277m0-58.108916a90.630169 90.630169 0 0 0-90.605494 90.617832 90.630169 90.630169 0 0 0 90.605494 90.605494 90.630169 90.630169 0 0 0 90.605494-90.605494 90.630169 90.630169 0 0 0-90.605494-90.617832z m-64.647711-44.389783c23.798747 22.059181 47.856578 27.055807 64.647711 27.055808 16.80347 0 40.861301-4.996627 64.647711-27.055808 6.896578 2.899277 13.978217 6.98294 19.974168 11.523085-7.180337 31.694651 0.542843 55.024578 8.882892 69.545638 8.364723 14.533398 24.699373 32.866699 55.764819 42.489832a97.93388 97.93388 0 0 1 0 23.070843c-31.065446 9.623133-47.400096 27.956434-55.764819 42.477494-8.340048 14.533398-16.14959 37.863325-8.882892 69.545638-5.995952 4.540145-13.07759 8.636145-19.986506 11.535422-23.774072-22.059181-47.831904-27.055807-64.635373-27.055807-16.791133 0-40.848964 4.996627-64.647711 27.055807a95.207325 95.207325 0 0 1-19.961831-11.535422c7.168-31.682313-0.542843-55.024578-8.895229-69.545638-8.352386-14.52106-24.699373-32.866699-55.752482-42.489831a97.93388 97.93388 0 0 1 0-23.058506c31.053108-9.623133 47.400096-27.956434 55.752482-42.489832 8.352386-14.52106 16.161928-37.850988 8.882891-69.545638 6.008289-4.441446 13.07759-8.623807 19.986506-11.523085M751.036145 61.686747c-11.140627 0-21.73841 4.762217-29.14082 13.07759-9.894554 11.165301-20.072867 16.791133-30.226506 16.791133-10.178313 0-20.257928-5.625831-30.238843-16.791133a39.023036 39.023036 0 0 0-38.591229-11.893204c-23.416289 5.798554-48.744867 20.418313-65.548337 37.850987a38.874988 38.874988 0 0 0-8.895229 39.405494c9.438072 28.326554-0.912964 46.302072-30.226506 52.298025a38.776289 38.776289 0 0 0-29.609639 27.41359c-6.625157 23.157205-6.625157 52.483084 0 75.627952a38.899663 38.899663 0 0 0 29.609639 27.41359c29.227181 5.995952 39.664578 23.97147 30.226506 52.310362a39.084723 39.084723 0 0 0 8.895229 39.393156c16.80347 17.333976 42.132048 31.953735 65.548337 37.863325a39.010699 39.010699 0 0 0 38.578892-11.893204c9.906892-11.177639 20.072867-16.80347 30.238843-16.80347 10.165976 0 20.24559 5.625831 30.226506 16.80347a39.010699 39.010699 0 0 0 38.591229 11.893204c23.428627-5.810892 48.757205-20.430651 65.548337-37.875662a38.874988 38.874988 0 0 0 8.907566-39.393157c-9.45041-28.326554 0.900627-46.302072 30.226507-52.298024a38.763952 38.763952 0 0 0 29.597301-27.41359c6.625157-23.144867 6.625157-52.470747 0-75.627952a38.899663 38.899663 0 0 0-29.597301-27.41359c-29.239518-5.995952-39.676916-23.97147-30.226507-52.298025a39.072386 39.072386 0 0 0-8.907566-39.405494c-16.791133-17.333976-42.119711-31.953735-65.548337-37.850987A37.875663 37.875663 0 0 0 751.036145 61.686747z m41.675566 489.718747c14.804819 8.438747 28.869398 10.61012 39.578217 10.61012 10.721157 0 24.872096-2.257735 39.590554-10.61012a78.465542 78.465542 0 0 0 10.61012 39.578217 80.29147 80.29147 0 0 0 28.968097 28.968096 78.909687 78.909687 0 0 0-28.955759 28.955759 79.68694 79.68694 0 0 0-10.622458 39.590554 79.26747 79.26747 0 0 0-39.590554-10.622457c-10.708819 0-24.872096 2.270072-39.578217 10.61012a78.465542 78.465542 0 0 0-10.622458-39.578217 80.29147 80.29147 0 0 0-28.968096-28.955759 78.909687 78.909687 0 0 0 28.968096-28.968096 79.68694 79.68694 0 0 0 10.61012-39.578217m81.081061-68.37359a27.018795 27.018795 0 0 0-20.331952 9.178988c-6.908916 7.809542-13.978217 11.708145-21.158554 11.708144-7.168 0-14.163277-3.898602-21.146217-11.720482a27.314892 27.314892 0 0 0-26.969446-8.340048c-16.346988 4.071325-34.051084 14.336-45.759229 26.414265a27.179181 27.179181 0 0 0-6.267373 27.512289c6.637494 19.789108-0.629205 32.323855-21.146217 36.592579-9.894554 2.085012-17.889157 9.438072-20.702073 19.147566-4.626506 16.248289-4.626506 36.67894 0 52.840867 2.812916 9.709494 10.807518 17.148916 20.702073 19.159904 20.418313 4.170024 27.685012 16.791133 21.146217 36.580241a27.179181 27.179181 0 0 0 6.267373 27.512289c11.720482 12.164627 29.412241 22.330602 45.759229 26.426602a27.018795 27.018795 0 0 0 26.969446-8.352385c6.896578-7.809542 13.978217-11.720482 21.146217-11.720482 7.180337 0 14.163277 3.91094 21.158554 11.720482a27.314892 27.314892 0 0 0 26.957108 8.352385c16.346988-4.096 34.051084-14.348337 45.771567-26.426602 7.069301-7.266699 9.438072-17.889157 6.255036-27.512289-6.625157-19.789108 0.641542-32.323855 21.158554-36.580241a27.425928 27.425928 0 0 0 20.689735-19.159904c4.638843-16.248289 4.638843-36.67894 0-52.840867a27.27788 27.27788 0 0 0-20.689735-19.147566c-20.430651-4.182361-27.697349-16.80347-21.158554-36.592579a27.179181 27.179181 0 0 0-6.267374-27.512289c-11.720482-12.164627-29.412241-22.330602-45.759229-26.414265a27.573976 27.573976 0 0 0-6.625156-0.826602z" fill="#0D8DDA" ></path></symbol><symbol id="icon-a-xinpianbeifen3" viewBox="0 0 1024 1024"><path d="M974.305157 296.380145L795.820723 117.908048a64.228241 64.228241 0 0 0-50.533783-18.654072 59.934843 59.934843 0 0 0-5.181687-0.246747H644.996627l-6.662169 3.725879c-35.223133 19.591711-80.180434 30.386892-126.568868 30.386892-46.388434 0-91.333398-10.795181-126.55653-30.386892l-6.674506-3.713542h-95.096289A64.795759 64.795759 0 0 0 226.143614 133.243373L49.719518 309.66747A64.067855 64.067855 0 0 0 30.843373 355.266313c0 17.22294 6.711518 33.409542 18.876145 45.586506L178.644819 529.765783a63.932145 63.932145 0 0 0 39.726265 18.604723v311.518072a65.178217 65.178217 0 0 0 65.104193 65.104193h456.642313a65.178217 65.178217 0 0 0 65.091856-65.104193V535.120193a63.944482 63.944482 0 0 0 40.207421-18.654073l128.925302-128.900626a64.573687 64.573687 0 0 0-0.024675-91.173012zM932.703614 345.951614L803.790651 474.864578a5.453108 5.453108 0 0 1-3.947952 1.62853 5.576482 5.576482 0 0 1-3.873928-1.529831L746.347952 428.106024v431.770217c0 3.454458-2.812916 6.255036-6.255036 6.255036H283.450602a6.242699 6.242699 0 0 1-6.242698-6.255036V443.478361l-49.226024 44.833928a5.564145 5.564145 0 0 1-7.747856-0.160385L91.333398 359.263614a5.502458 5.502458 0 0 1-1.640868-3.984963 5.551807 5.551807 0 0 1 1.640868-3.984964L269.447711 173.179373l5.675181-5.095325 2.553831-6.304385a6.255036 6.255036 0 0 1 5.798554-3.923277h80.069398c43.057349 22.330602 94.133976 34.088096 148.24559 34.088096 54.123952 0 105.200578-11.757494 148.257928-34.088096h80.020048c0.320771 0.012337 0.641542 0.061687 0.949976 0.111036l4.194699 0.60453 4.207036-0.616868a5.292723 5.292723 0 0 1 4.811566 1.554506L932.703614 337.981687a5.638169 5.638169 0 0 1 0 7.969927z" fill="#0D8DDA" ></path></symbol><symbol id="icon-a-xinpianbeifen2" viewBox="0 0 1024 1024"><path d="M906.338699 107.951807H117.661301a59.848482 59.848482 0 0 0-59.860819 59.86082v538.735036a59.910169 59.910169 0 0 0 59.860819 59.848482H384.801928c4.108337 0 7.476434 3.368096 7.476433 7.488771v78.564241a3.750554 3.750554 0 0 1-3.738216 3.738216h-56.122603a29.893398 29.893398 0 0 0-29.918072 29.93041v29.93041H721.488193v-29.93041a29.893398 29.893398 0 0 0-29.918073-29.93041h-56.134939a3.750554 3.750554 0 0 1-3.72588-3.738216v-78.564241c0-4.120675 3.368096-7.488771 7.476434-7.488771h267.140626a59.910169 59.910169 0 0 0 59.86082-59.848482V167.812627a59.848482 59.848482 0 0 0-59.86082-59.86082zM571.860819 852.449157a3.750554 3.750554 0 0 1-3.738217 3.738216H455.86506a3.750554 3.750554 0 0 1-3.738217-3.738216v-48.633832c0-4.120675 3.368096-7.488771 7.488771-7.488771h104.744097c4.120675 0 7.488771 3.368096 7.488771 7.488771v48.633832z m334.47788-160.879037c0 8.241349-6.736193 14.977542-14.965205 14.977543h-758.746988a15.014554 15.014554 0 0 1-14.965205-14.965205V650.42506c0-2.060337 1.67788-3.738217 3.738217-3.738217h781.200964c2.060337 0 3.738217 1.67788 3.738217 3.738217v41.157398z m-3.738217-104.744096H121.399518a3.750554 3.750554 0 0 1-3.738217-3.738217V182.777831c0-8.229012 6.736193-14.965205 14.965205-14.965204h758.746988c8.229012 0 14.965205 6.736193 14.965205 14.965204v400.309976a3.750554 3.750554 0 0 1-3.738217 3.738217z" fill="#0D8DDA" ></path></symbol><symbol id="icon-baozhang" viewBox="0 0 1024 1024"><path d="M788.212185 67.284677c15.076431 0.047262 28.766523 7.798154 35.115323 19.897108L994.067692 412.766523c6.191262 11.799631 4.316554 25.678769-4.852184 35.855754L542.168615 943.844431c-7.3728 8.065969-18.621046 12.870892-30.263138 12.870892-11.657846 0-22.906092-4.631631-30.263139-12.870892L34.784492 448.622277c-9.168738-10.176985-11.027692-24.056123-4.852184-35.855754L200.672492 87.181785c6.207015-12.177723 19.991631-19.897108 35.131077-19.897108z m-24.843816 68.623754H260.631631L110.450215 422.360615l401.644308 445.140677L913.565538 422.360615 763.368369 135.908431zM372.389415 342.268062c15.139446-13.390769 39.778462-13.390769 54.917908 0l85.181046 75.303384 84.393354-74.625969c15.139446-13.390769 39.589415-13.390769 54.917908 0 15.123692 13.390769 15.123692 35.162585 0 48.553354l-98.760862 87.307815c-22.464985 19.6608-58.651569 19.6608-81.1008 0l-99.548554-88.000984c-15.123692-13.390769-15.123692-35.162585 0-48.5376z" fill="#FFFFFF" ></path></symbol><symbol id="icon-a-xinpianbeifen7" viewBox="0 0 1024 1024"><path d="M667.240867 977.73494H356.759133c-68.595663 0-124.200096-55.604434-124.200097-124.200097v-372.587951c0-118.512578 83.067373-217.470458 194.115856-242.256193a92.653494 92.653494 0 0 1-7.82188-37.184771c0-40.491181 25.994795-74.603952 62.09388-87.434795v-4.774555a215.841928 215.841928 0 0 0-135.365398 55.727808l-0.493494-0.616868c-5.045976 3.528482-10.832193 6.045301-17.445012 6.045301A31.053108 31.053108 0 0 1 296.58988 139.412048c0-12.05359 7.069301-22.207229 17.111903-27.351903 33.668627-28.092145 73.444241-48.942265 117.550265-58.923181 5.243373-4.058988 11.510747-6.871904 18.641735-6.871904h124.200097a31.040771 31.040771 0 0 1 31.053108 31.053109c0 13.694458-9.03094 24.970795-21.343615 29.09147v1.949301h-40.750265v5.712193c36.086747 12.830843 62.09388 46.943614 62.09388 87.434795a92.653494 92.653494 0 0 1-7.82188 37.184771c111.036145 24.785735 194.115855 123.743614 194.115856 242.256193v372.587951c0 68.595663-55.604434 124.200096-124.200097 124.200097zM512 170.465157a31.053108 31.053108 0 1 0 0 62.093879 31.053108 31.053108 0 0 0 0-62.093879z m217.334747 558.881927V480.946892c0-102.881157-83.400482-186.293976-186.293976-186.293976h-62.093879c-102.893494 0-186.293976 83.400482-186.293976 186.293976v372.587951a62.09388 62.09388 0 0 0 62.106217 62.106217h310.481734a62.09388 62.09388 0 0 0 62.09388-62.106217V729.347084zM605.146988 853.534843h-186.293976a62.09388 62.09388 0 0 1-62.093879-62.093879v-186.293976a62.09388 62.09388 0 0 1 62.093879-62.09388h186.293976a62.09388 62.09388 0 0 1 62.093879 62.09388v186.293976a62.09388 62.09388 0 0 1-62.093879 62.093879zM574.09388 605.146988H449.893783a31.053108 31.053108 0 0 0 0 62.093879h124.200097a31.053108 31.053108 0 1 0 0-62.093879z m0 124.200096H449.893783a31.053108 31.053108 0 0 0 0 62.09388h124.200097a31.053108 31.053108 0 1 0 0-62.09388z" fill="#0D8DDA" ></path></symbol><symbol id="icon-a-xinpianbeifen4" viewBox="0 0 1024 1024"><path d="M742.659084 86.361446a29.387566 29.387566 0 1 1 0 58.799807h-52.125301v174.91894L926.164819 836.79306c10.696482 20.874795 9.697157 46.622843-3.207711 67.719711A68.546313 68.546313 0 0 1 864.107952 937.638554H159.768675a68.570988 68.570988 0 0 1-58.812145-33.125783 70.014458 70.014458 0 0 1-2.65253-68.879422l235.051181-515.553156V145.161253h-52.112964a29.387566 29.387566 0 1 1 0-58.799807h461.40453z m-75.850024 323.386602H357.092241L151.255904 861.196337c-3.25706 6.452434-1.172048 10.943229-0.123374 12.621109a9.993253 9.993253 0 0 0 8.660819 5.033638h704.339278c4.860916 0 7.525783-3.146024 8.673156-5.033638a11.535422 11.535422 0 0 0 0.431807-11.44906L666.80906 409.748048z m-8.093301 269.904193a58.849157 58.849157 0 0 1 58.799807 58.799807 58.849157 58.849157 0 0 1-58.799807 58.799807 58.849157 58.849157 0 0 1-58.812145-58.799807 58.849157 58.849157 0 0 1 58.812145-58.799807zM384.308434 620.852434a68.682024 68.682024 0 0 1 68.595662 68.595662 68.682024 68.682024 0 0 1-68.595662 68.595663 68.682024 68.682024 0 0 1-68.595663-68.595663 68.682024 68.682024 0 0 1 68.595663-68.595662z m274.38265 97.995566a19.616386 19.616386 0 0 0-19.591711 19.604048 19.616386 19.616386 0 0 0 19.604049 19.591711 19.616386 19.616386 0 0 0 19.591711-19.591711 19.616386 19.616386 0 0 0-19.591711-19.604048zM384.333108 660.048193a29.424578 29.424578 0 0 0-29.399903 29.399903 29.424578 29.424578 0 0 0 29.399903 29.399904 29.424578 29.424578 0 0 0 29.387567-29.399904 29.424578 29.424578 0 0 0-29.387567-29.399903z m186.195278-176.399422a39.208096 39.208096 0 1 1 0 78.403856 39.208096 39.208096 0 0 1 0-78.403856z m61.217927-338.487518H392.154988v181.309687c0 4.207036-0.888289 8.352386-2.640193 12.201638l-5.625831 12.288h256.111036l-5.601157-12.300337a29.288867 29.288867 0 0 1-2.65253-12.213976l-0.012337-181.285012z" fill="#0D8DDA" ></path></symbol><symbol id="icon-huojian" viewBox="0 0 1024 1024"><path d="M194.339446 691.593846c35.257108-9.247508 71.349169-2.016492 99.1232 20.0704 3.796677 2.961723 7.357046 6.049477 10.681108 9.499569 3.213785 3.198031 6.411815 6.774154 9.263261 10.555077 21.960862 27.789785 29.317908 63.866092 20.054647 99.012923a122.4704 122.4704 0 0 1-71.821785 82.030277l-2.835692 1.071262-209.526154 61.959877 63.031138-212.361846a122.4704 122.4704 0 0 1 82.030277-71.837539z m236.591262-408.702031C633.210092 80.612431 852.220062-5.466585 940.315569 82.628923c88.064 88.190031 2.016492 307.2-200.262892 509.369108a1180.041846 1180.041846 0 0 1-84.881723 76.926031l0.708923 0.236307-84.157046 278.260185-160.027569-160.011816-176.049231-176.285538L75.634215 451.095631l278.134154-84.157046 0.236308 0.8192a1208.682338 1208.682338 0 0 1 76.926031-84.86597z m-175.340308 476.727139c-17.329231-13.642831-36.076308-11.390031-45.701908-8.900923a61.187938 61.187938 0 0 0-40.487384 34.548184L139.736615 885.334646l100.194462-29.680246a61.187938 61.187938 0 0 0 34.532431-40.487385c2.489108-9.609846 4.757662-28.356923-8.900923-45.449846a63.377723 63.377723 0 0 0-4.631631-5.230277 49.608862 49.608862 0 0 0-5.340554-4.867938z m318.2592-30.026831a785.896369 785.896369 0 0 1-84.046769 49.498585l53.074707 53.058954zM897.213046 125.825969C844.516431 73.255385 657.786092 142.446277 474.143508 326.104615c-82.392615 82.266585-147.203938 171.307323-184.60357 252.738954l154.560985 154.560985c80.722708-37.163323 171.779938-103.392492 252.849231-184.477539 183.642585-183.642585 252.975262-370.372923 200.262892-423.085292zM293.462646 449.079138l-102.557538 30.987816 53.058954 53.058954a797.743262 797.743262 0 0 1 49.498584-84.04677z m338.802216-159.302892c29.0816 0 56.256985 11.264 76.8 31.822769a107.945354 107.945354 0 0 1 31.822769 76.784247 107.740554 107.740554 0 0 1-31.822769 76.815753 107.945354 107.945354 0 0 1-76.8 31.82277 107.740554 107.740554 0 0 1-76.815754-31.82277 107.945354 107.945354 0 0 1-31.82277-76.815753c0-29.0816 11.295508-56.256985 31.82277-76.8a107.945354 107.945354 0 0 1 76.815754-31.82277z m0 61.014646c-12.713354 0-24.702031 4.978215-33.602954 13.879139a47.040985 47.040985 0 0 0-13.894893 33.602954c0 12.6976 4.993969 24.686277 13.894893 33.71323 17.927877 17.927877 49.388308 17.927877 67.316184 0a47.104 47.104 0 0 0 13.879139-33.71323c0-12.6976-4.978215-24.686277-13.879139-33.602954a47.3088 47.3088 0 0 0-33.71323-13.879139z" fill="#FFFFFF" ></path></symbol><symbol id="icon-xiaoshouhanjine" viewBox="0 0 1024 1024"><path d="M357.958892 1016.123077C164.627692 1016.123077 7.876923 859.372308 7.876923 666.041108c0-193.346954 156.750769-350.081969 350.081969-350.08197 193.346954 0 350.081969 156.735015 350.08197 350.08197 0 193.346954-156.735015 350.081969-350.08197 350.081969z m0-70.782031c154.245908 0 279.299938-125.054031 279.299939-279.299938s-125.054031-279.299938-279.299939-279.299939S78.658954 511.7952 78.658954 666.041108s125.054031 279.299938 279.315692 279.299938zM928.531692 138.555077a40.613415 40.613415 0 0 0-42.015507 40.581908v74.562953L615.313723 31.1296l-190.0544 128.4096-122.092308-127.023262a40.487385 40.487385 0 0 0-59.297477 1.008247 45.481354 45.481354 0 0 0 1.969231 62.857846l179.436308 176.033477 190.038646-128.07877L823.611077 309.358277h-63.2832a42.047015 42.047015 0 0 0-42.047015 42.047015v0.252062a41.794954 41.794954 0 0 0 41.999753 41.542892l210.235077-1.181538V182.114462a43.559385 43.559385 0 0 0-42.015507-43.512124v-0.047261z m-538.624 512.252061v62.936616h104.826093a31.476185 31.476185 0 1 1 0 62.952369h-104.826093v115.270892a31.476185 31.476185 0 0 1-62.936615 0v-115.318153h-104.778831a31.476185 31.476185 0 0 1 0-62.936616h104.763077v-62.952369h-104.763077a31.476185 31.476185 0 0 1 0-62.936615h76.248616l-73.980062-88.158524a31.602215 31.602215 0 0 1 3.607631-44.6464 31.350154 31.350154 0 0 1 44.599138 4.190524l85.763939 102.226707 85.8112-102.258215a31.350154 31.350154 0 0 1 44.583384-4.206277 31.665231 31.665231 0 0 1 3.623385 44.693661l-73.964308 88.158524h76.248616a31.476185 31.476185 0 0 1 0 62.936615h-104.826093v0.047261z m536.85957 253.873231a41.968246 41.968246 0 0 0 83.920738 0v-223.862154a41.968246 41.968246 0 1 0-83.920738 0v223.862154z m-166.675693 1.213046a41.117538 41.117538 0 0 0 82.203569 0V485.848615a41.117538 41.117538 0 1 0-82.235076 0v420.029047h0.031507z" fill="#FFFFFF" ></path></symbol><symbol id="icon-a-xinpianbeifen5" viewBox="0 0 1024 1024"><path d="M847.538892 307.2c3.133687-51.150651-18.333301-100.277976-60.638073-138.622458-37.419181-34.014072-89.963952-57.615422-144.063229-64.894458-55.851181-7.464096-109.962795 2.677205-152.538988 28.585639-49.867566 30.312867-82.672578 80.735614-94.837204 145.802795-28.573301 152.366265-63.228916 178.805205-99.920193 206.823325-21.281928 16.223614-45.339759 34.667952-67.189205 72.173494-19.813783 34.100434-33.829012 71.248193-40.639229 107.557012-8.019277 42.77359-5.90959 82.314795 6.267374 117.611952a179.755181 179.755181 0 0 0 41.93465 67.929446c20.085205 20.554024 45.808578 37.135422 76.220145 49.312386 38.344482 15.384675 77.601928 23.218892 116.773012 23.218891h0.925301c38.714602-0.086361 77.601928-7.834217 115.47759-23.033831 73.283855-29.313542 142.496386-85.349783 205.737639-166.739277 29.399904-37.789301 52.717494-84.239422 69.298891-137.882217 13.003566-42.119711 21.948145-88.754892 26.549976-138.795181 6.908916-75.319518 2.023325-134.945928 0.641543-149.047518z m-65.067181 144.519711c-6.637494 70.42159-26.278554 169.502843-82.401157 241.664-84.140723 108.297253-178.250024 164.518554-272.161927 164.518554-30.707663 0-61.390651-5.983614-91.715856-18.148241-41.74959-16.778795-69.126169-43.143711-81.204434-78.440867-19.357301-56.32 2.393446-125.618892 29.214844-171.797591 15.397012-26.451277 31.620627-38.899663 50.509108-53.272674 21.294265-16.223614 45.438458-34.667952 67.744386-72.259856 23.78641-40.096386 41.663229-95.306024 56.406361-173.931952 17.235277-91.97494 83.881639-124.150747 148.578699-124.150747 9.03094 0 18.06188 0.65388 26.920096 1.850603 41.465831 5.527133 81.290795 23.31759 109.308916 48.658506 19.813783 17.975518 42.674892 47.930602 39.442506 88.767229l-0.271422 3.133686 0.370121 3.133687c-0.098699 0.456482 6.637494 61.933494-0.740241 140.275663zM515.553157 323.238554c-14.187952 0.271422-25.908434 11.239325-27.006458 25.439615-1.295422 15.754795-3.960289 37.604241-9.956241 60.823132-11.979566 46.832578-31.608289 80.377831-58.429687 100.105253a27.734361 27.734361 0 0 0-9.03094 33.730313c7.180337 15.939855 27.265542 21.466988 41.37947 11.152964 70.42159-51.335711 87.286747-150.972145 91.247036-201.296192 1.196723-16.408675-11.794506-30.325205-28.20318-29.955085z" fill="#0D8DDA" ></path></symbol></svg>',function(i){var a=(a=document.getElementsByTagName("script"))[a.length-1],c=a.getAttribute("data-injectcss"),a=a.getAttribute("data-disable-injectsvg");if(!a){var l,t,e,o,n,h=function(a,c){c.parentNode.insertBefore(a,c)};if(c&&!i.__iconfont__svg__cssinject__){i.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(a){console&&console.log(a)}}l=function(){var a,c=document.createElement("div");c.innerHTML=i._iconfont_svg_string_4497966,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(a=document.body).firstChild?h(c,a.firstChild):a.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(l,0):(t=function(){document.removeEventListener("DOMContentLoaded",t,!1),l()},document.addEventListener("DOMContentLoaded",t,!1)):document.attachEvent&&(e=l,o=i.document,n=!1,m(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,v())})}function v(){n||(n=!0,e())}function m(){try{o.documentElement.doScroll("left")}catch(a){return void setTimeout(m,50)}v()}}(window);
\ No newline at end of file
{
"id": "4497966",
"name": "liebao",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "39843205",
"name": "多语言",
"font_class": "duoyuyan",
"unicode": "e7b0",
"unicode_decimal": 59312
},
{
"icon_id": "39842899",
"name": "qq",
"font_class": "qq",
"unicode": "e7a9",
"unicode_decimal": 59305
},
{
"icon_id": "39842897",
"name": "芯片备份",
"font_class": "xinpianbeifen",
"unicode": "e7aa",
"unicode_decimal": 59306
},
{
"icon_id": "39842895",
"name": "客服",
"font_class": "kefu",
"unicode": "e7ab",
"unicode_decimal": 59307
},
{
"icon_id": "39842901",
"name": "服务",
"font_class": "fuwu",
"unicode": "e7ac",
"unicode_decimal": 59308
},
{
"icon_id": "39842900",
"name": "芯片",
"font_class": "xinpian",
"unicode": "e7ad",
"unicode_decimal": 59309
},
{
"icon_id": "39842896",
"name": "微信",
"font_class": "weixin",
"unicode": "e7ae",
"unicode_decimal": 59310
},
{
"icon_id": "39842894",
"name": "箭头_下一页",
"font_class": "jiantou_xiayiye",
"unicode": "e7af",
"unicode_decimal": 59311
},
{
"icon_id": "39842909",
"name": "芯片备份 6",
"font_class": "a-xinpianbeifen6",
"unicode": "e7a1",
"unicode_decimal": 59297
},
{
"icon_id": "39842905",
"name": "芯片备份 3",
"font_class": "a-xinpianbeifen3",
"unicode": "e7a2",
"unicode_decimal": 59298
},
{
"icon_id": "39842908",
"name": "芯片备份 2",
"font_class": "a-xinpianbeifen2",
"unicode": "e7a3",
"unicode_decimal": 59299
},
{
"icon_id": "39842902",
"name": "保障",
"font_class": "baozhang",
"unicode": "e7a0",
"unicode_decimal": 59296
},
{
"icon_id": "39842907",
"name": "芯片备份 7",
"font_class": "a-xinpianbeifen7",
"unicode": "e7a4",
"unicode_decimal": 59300
},
{
"icon_id": "39842904",
"name": "芯片备份 4",
"font_class": "a-xinpianbeifen4",
"unicode": "e7a5",
"unicode_decimal": 59301
},
{
"icon_id": "39842903",
"name": "火箭",
"font_class": "huojian",
"unicode": "e7a6",
"unicode_decimal": 59302
},
{
"icon_id": "39842898",
"name": "销售含金额",
"font_class": "xiaoshouhanjine",
"unicode": "e7a7",
"unicode_decimal": 59303
},
{
"icon_id": "39842906",
"name": "芯片备份 5",
"font_class": "a-xinpianbeifen5",
"unicode": "e7a8",
"unicode_decimal": 59304
}
]
}
No preview for this file type
No preview for this file type
No preview for this file type
@charset "utf-8";
@import "base.less";
body{
background: #ff5a2b;
.head {
height: 100px;
background: url("../images/head-bg.png") no-repeat top center;
.main {
height: 100px;
.logo {
width: 122px;
height: 58px;
}
.menu-box {
height: 100%;
.menu {
height: 100%;
li {
height: 100%;
margin-right: 40px;
a {
font-size: 16px;
color: #FFFFFF;
}
}
}
.simplified-chinese {
.iconfont {
margin-right: 4px;
font-size: 20px;
color: #cbdaeb;
}
span {
font-size: 16px;
color: #ffffff;
opacity: 0.8;
}
}
}
}
}
.slide-box {
width: 100%;
height: 620px;
background: #365C89;
}
.service {
padding: 70px 0 80px 0;
.title {
font-size: 38px;
color: #000;
font-weight: bold;
line-height: 53px;
margin-bottom: 23px;
}
.list {
li {
position: relative;
width: 416px;
height: 360px;
margin-right: 16px;
&:last-child {
margin-right: 0;
}
a {
display: block;
img {
width: 416px;
height: 360px;
object-fit: cover;
display: block;
}
.text {
position: absolute;
bottom: 24px;
left: 20px;
font-size: 24px;
color: #ffffff;
line-height: 33px;
}
}
}
}
}
.international-logistics-services {
padding: 70px 0 140px 0;
background: url("../images/international-logistics-services.png") no-repeat top center;
background-size: cover;
.title {
font-size: 38px;
color: #ffffff;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.text {
width: 1235px;
margin: 0 auto;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
line-height: 29px;
text-align: center;
opacity: 0.8;
}
.list {
margin-top: 133px;
box-sizing: border-box;
li {
width: 266px;
height: 112px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-sizing: border-box;
margin-right: 20px;
&:last-child {
margin-right: 0;
}
.iconfont {
font-size: 64px;
color: #fff;
margin-right: 54px;
}
span {
font-size: 18px;
color: #ffffff;
font-weight: bold;
}
}
}
}
.service-categories {
padding: 80px 0 80px 0;
.title {
font-size: 38px;
color: #000000;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.text {
font-size: 18px;
color: #474747;
opacity: 0.8;
text-align: center;
margin-bottom: 40px;
}
.list {
li {
position: relative;
width: 308px;
height: 160px;
background: #F3F3F3;
margin-right: 16px;
&:last-child {
margin-right: 0;
}
.iconfont {
position: absolute;
right: 12px;
bottom: 11px;
font-size: 82px;
color: #0d8dda;
}
span {
position: absolute;
top: 24px;
left: 35px;
font-size: 20px;
color: #000000;
font-weight: bold;
line-height: 28px;
}
}
}
}
.cooperation {
padding: 81px 0 159px 0;
background: url("../images/cooperation.png") top center;
background-size: cover;
.cooperation-form-box {
position: relative;
width: 480px;
box-sizing: border-box;
background: #FFFFFF;
box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3);
margin: 0 auto;
padding: 20px 0 22px 0;
.arrow {
position: absolute;
top: 25px;
left: 0;
width: 5px;
height: 26px;
background: #F8B62D;
}
.box {
width: 420px;
margin: 0 auto;
.title {
font-size: 24px;
color: #000000;
font-weight: bold;
line-height: 33px;
}
.tip {
font-size: 12px;
color: #989898;
opacity: 0.8;
line-height: 17px;
}
.cooperation-form {
.form-input {
label {
font-size: 14px;
color: #474747;
font-weight: bold;
line-height: 20px;
margin-bottom: 4px;
&:before {
font-size: 14px;
font-weight: bold;
color: #0d8dda;
content: "*";
}
}
.inp {
width: 200px;
height: 40px;
padding-left: 10px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
}
.layui-form-checked[lay-skin=primary] {
&:hover {
i {
border-color: #0D8DDA !important;
}
}
i {
border-color: #0D8DDA !important;
background-color: #0D8DDA;
}
}
}
.textared-box {
width: 420px;
height: 80px;
margin-bottom: 20px;
box-sizing: border-box;
textarea {
width: 420px;
height: 80px;
padding: 5px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
resize: none;
}
}
}
.btn {
width: 420px;
height: 48px;
background: #0D8DDA;
border-radius: 6px;
font-size: 18px;
color: #FFFFFF;
line-height: 25px;
font-weight: bold;
letter-spacing: 2px;
}
}
}
}
\ No newline at end of file
......@@ -158,7 +158,267 @@ body {
.verCenter {
align-items: center;
}
body {
background: #ff5a2b;
.main {
width: 1280px;
margin: 0 auto;
}
.head {
height: 100px;
background: url("../images/head-bg.png") no-repeat top center;
}
.head .main {
height: 100px;
}
.head .main .logo {
width: 122px;
height: 58px;
}
.head .main .menu-box {
height: 100%;
}
.head .main .menu-box .menu {
height: 100%;
}
.head .main .menu-box .menu li {
height: 100%;
margin-right: 40px;
}
.head .main .menu-box .menu li a {
font-size: 16px;
color: #FFFFFF;
}
.head .main .menu-box .simplified-chinese .iconfont {
margin-right: 4px;
font-size: 20px;
color: #cbdaeb;
}
.head .main .menu-box .simplified-chinese span {
font-size: 16px;
color: #ffffff;
opacity: 0.8;
}
.slide-box {
width: 100%;
height: 620px;
background: #365C89;
}
.service {
padding: 70px 0 80px 0;
}
.service .title {
font-size: 38px;
color: #000;
font-weight: bold;
line-height: 53px;
margin-bottom: 23px;
}
.service .list li {
position: relative;
width: 416px;
height: 360px;
margin-right: 16px;
}
.service .list li:last-child {
margin-right: 0;
}
.service .list li a {
display: block;
}
.service .list li a img {
width: 416px;
height: 360px;
object-fit: cover;
display: block;
}
.service .list li a .text {
position: absolute;
bottom: 24px;
left: 20px;
font-size: 24px;
color: #ffffff;
line-height: 33px;
}
.international-logistics-services {
padding: 70px 0 140px 0;
background: url("../images/international-logistics-services.png") no-repeat top center;
background-size: cover;
}
.international-logistics-services .title {
font-size: 38px;
color: #ffffff;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.international-logistics-services .text {
width: 1235px;
margin: 0 auto;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
line-height: 29px;
text-align: center;
opacity: 0.8;
}
.international-logistics-services .list {
margin-top: 133px;
box-sizing: border-box;
}
.international-logistics-services .list li {
width: 266px;
height: 112px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-sizing: border-box;
margin-right: 20px;
}
.international-logistics-services .list li:last-child {
margin-right: 0;
}
.international-logistics-services .list li .iconfont {
font-size: 64px;
color: #fff;
margin-right: 54px;
}
.international-logistics-services .list li span {
font-size: 18px;
color: #ffffff;
font-weight: bold;
}
.service-categories {
padding: 80px 0 80px 0;
}
.service-categories .title {
font-size: 38px;
color: #000000;
font-weight: bold;
line-height: 53px;
margin-bottom: 14px;
}
.service-categories .text {
font-size: 18px;
color: #474747;
opacity: 0.8;
text-align: center;
margin-bottom: 40px;
}
.service-categories .list li {
position: relative;
width: 308px;
height: 160px;
background: #F3F3F3;
margin-right: 16px;
}
.service-categories .list li:last-child {
margin-right: 0;
}
.service-categories .list li .iconfont {
position: absolute;
right: 12px;
bottom: 11px;
font-size: 82px;
color: #0d8dda;
}
.service-categories .list li span {
position: absolute;
top: 24px;
left: 35px;
font-size: 20px;
color: #000000;
font-weight: bold;
line-height: 28px;
}
.cooperation {
padding: 81px 0 159px 0;
background: url("../images/cooperation.png") top center;
background-size: cover;
}
.cooperation .cooperation-form-box {
position: relative;
width: 480px;
box-sizing: border-box;
background: #FFFFFF;
box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3);
margin: 0 auto;
padding: 20px 0 22px 0;
}
.cooperation .cooperation-form-box .arrow {
position: absolute;
top: 25px;
left: 0;
width: 5px;
height: 26px;
background: #F8B62D;
}
.cooperation .cooperation-form-box .box {
width: 420px;
margin: 0 auto;
}
.cooperation .cooperation-form-box .box .title {
font-size: 24px;
color: #000000;
font-weight: bold;
line-height: 33px;
}
.cooperation .cooperation-form-box .box .tip {
font-size: 12px;
color: #989898;
opacity: 0.8;
line-height: 17px;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input label {
font-size: 14px;
color: #474747;
font-weight: bold;
line-height: 20px;
margin-bottom: 4px;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input label:before {
font-size: 14px;
font-weight: bold;
color: #0d8dda;
content: "*";
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .inp {
width: 200px;
height: 40px;
padding-left: 10px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .layui-form-checked[lay-skin=primary]:hover i {
border-color: #0D8DDA !important;
}
.cooperation .cooperation-form-box .box .cooperation-form .form-input .layui-form-checked[lay-skin=primary] i {
border-color: #0D8DDA !important;
background-color: #0D8DDA;
}
.cooperation .cooperation-form-box .box .cooperation-form .textared-box {
width: 420px;
height: 80px;
margin-bottom: 20px;
box-sizing: border-box;
}
.cooperation .cooperation-form-box .box .cooperation-form .textared-box textarea {
width: 420px;
height: 80px;
padding: 5px;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 6px;
border: 1px solid #DADADA;
resize: none;
}
.cooperation .cooperation-form-box .box .btn {
width: 420px;
height: 48px;
background: #0D8DDA;
border-radius: 6px;
font-size: 18px;
color: #FFFFFF;
line-height: 25px;
font-weight: bold;
letter-spacing: 2px;
}
/*# sourceMappingURL=style.min.css.map */
\ No newline at end of file
{"version":3,"sources":["style.less","base.less"],"names":[],"mappings":"AAAA,SAAS;ACAT;EACI,qBAAA;;AAGJ;EACI,8BAAA;EACA,0BAAA;;AAGJ;AAAM;EACF,iBAAA;EACA,eAAe,mBAAmB,oBAAoB,iEAAiE,uBAAuB,YAA9I;;AAGJ,IAAK;EACD,aAAA;EACA,yCAAA;EACA,6CAAA;;AAGJ;AAAM;AAAK;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAI;AAAK;AAAM;AAAM;AAAU;AAAQ;AAAO;AAAU;AAAG;AAAY;AAAI;AAAI;AAAI;AAAQ;AAAS;AAAO;AAAS;AAAY;AAAQ;AAAQ;AAAQ;AAAM;AAAK;EACtN,SAAA;EACA,UAAA;;AAGJ;AAAQ;AAAO;AAAQ;EACnB,eAAA;EACA,YAAA;EACA,wBAAA;;AAGJ,KAAK;AAAe,KAAK;AAAa,KAAK;EACvC,eAAA;;AAGJ;EACI,yBAAA;EACA,iBAAA;;AAGJ;AAAI;AAAI;EACJ,gBAAA;;AAGJ;AAAI;AAAI;AAAI;AAAI;AAAI;EAChB,eAAA;EACA,gBAAA;;AAGJ;AAAI;AAAG;EACH,kBAAA;;AAGJ;EACI,qBAAA;;AAGJ;EACI,YAAA;;AAGJ;EACI,QAAA;EACA,WAAA;;AAGJ,IAAI;EACA,SAAS,GAAT;EACA,WAAA;EACA,SAAA;EACA,kBAAA;EACA,cAAA;;AAGJ;EACI,WAAA;EACA,gBAAA;;AAGJ;EACI,YAAA;EACA,gBAAA;;AAGJ;EACI,mBAAA;;AAGJ;EACI,sBAAA;;AAGJ;EACI,sBAAA;;AAGJ;EACI,8BAAA;EACA,sBAAA;;AAGJ;AAAM;EACF,WAAA;EACA,iCAAA;;AAGJ;EACI,kBAAA;;AAEJ;EACI,aAAA;EACA,mBAAA;;AAGJ;EACI,aAAA;EACA,sBAAA;;AAGJ;EACI,8BAAA;;AAGJ;EACI,6BAAA;;AAGJ;EACI,uBAAA;;AAGJ;EACI,mBAAA;;ADjIJ;EACI,mBAAA","file":"style.min.css"}
\ No newline at end of file
{"version":3,"sources":["style.less","base.less"],"names":[],"mappings":"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","file":"style.min.css"}
\ No newline at end of file
No preview for this file type
......@@ -10,14 +10,190 @@
<meta name="baidu-site-verification" content="B1YyUdsoGu">
<link href="/favicon.ico" rel="icon">
<title>猎豹出海</title>
<link rel="stylesheet" type="text/css" href="css/font/iconfont.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="js/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="css/style.min.css">
</head>
<body>
<section class="page-main">
<h2 class="wow" style="padding: 20px;text-align: center;font-size: 30px;">猎豹出海</h2>
</section>
<!--head-->
<div class="head">
<div class="main row bothSide verCenter">
<a href="/" class="logo row verCenter">
<img src="./images/logo.png " width="122" height="58" title="猎豹出海" alt="猎豹出海">
</a>
<div class="menu-box row verCenter">
<ul class="menu row verCenter">
<li class="curr row verCenter"><a href="/">首页</a></li>
<li class="row verCenter"><a href="/">国际海运</a></li>
<li class="row verCenter"><a href="/">国际空运</a></li>
<li class="row verCenter"><a href="/">国际陆运</a></li>
<li class="row verCenter"><a href="/">国际铁路</a></li>
<li class="row verCenter"><a href="/">国际铁路</a></li>
<li class="row verCenter"><a href="/">关于我们</a></li>
</ul>
<div class="simplified-chinese row verCenter">
<i class="iconfont icon-duoyuyan"></i>
<span>简体中文</span>
</div>
</div>
</div>
</div>
<!--焦点图-->
<div class="slide-box"></div>
<!--服务中心-->
<div class="service">
<p class="title row rowCenter verCenter">服务中心</p>
<div class="main">
<ul class="list row rowCenter verCenter" style="margin-bottom: 16px;">
<li class="row">
<a href="">
<img src="./images/service-1.png" alt="">
<p class="text">国际海运</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-2.png" alt="">
<p class="text">国际空运</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-3.png" alt="">
<p class="text">国际陆运</p>
</a>
</li>
</ul>
<ul class="list row rowCenter verCenter">
<li class="row">
<a href="">
<img src="./images/service-4.png" alt="">
<p class="text">国际铁路</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-5.png" alt="">
<p class="text">进出口报关</p>
</a>
</li>
<li class="row">
<a href="">
<img src="./images/service-6.png" alt="">
<p class="text">国内外仓储</p>
</a>
</li>
</ul>
</div>
</div>
<!--国际物流服务-->
<div class="international-logistics-services">
<p class="title row rowCenter verCenter">国际物流服务</p>
<p class="text">
作为一家国际物流供应链公司,我们整合了先进的智能设备和传感技术,为客户提供实时监控和追踪物流运输过程的能力。我们的智能硬件支持与软件系统的无缝对接,实现数据共享和智能化决策。通过智能硬件的应用,有效提升物流安全性、准确性和可追溯性,提供了更可靠、高效的服务。
</p>
<div class="main">
<ul class="list row rowCenter verCenter">
<li class="row rowCenter verCenter">
<i class="iconfont icon-xiaoshouhanjine"></i>
<span>价格实惠</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-baozhang"></i>
<span>安全可靠</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-huojian"></i>
<span>高效便捷</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-fuwu"></i>
<span>贴心服务</span>
</li>
</ul>
</div>
</div>
<!--服务类目-->
<div class="service-categories">
<p class="title row rowCenter verCenter">服务类目</p>
<p class="text">
作为一家国际物流供应链公司,我们整合了先进的智能设备和传感技术,为客户提供实时监控和追踪物流运输过程的能力。
</p>
<div class="main">
<ul class="list row rowCenter verCenter" style="margin-bottom: 16px">
<li class="row rowCenter verCenter">
<i class="iconfont icon-xinpian"></i>
<span>电子元器件</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-xinpianbeifen"></i>
<span>家居建材</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen2"></i>
<span>电子产品</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen3"></i>
<span>服装类</span>
</li>
</ul>
<ul class="list row rowCenter verCenter">
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen4"></i>
<span>化学品类</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen5"></i>
<span>食品类</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen6"></i>
<span>机械设备</span>
</li>
<li class="row rowCenter verCenter">
<i class="iconfont icon-a-xinpianbeifen7"></i>
<span>日用品类</span>
</li>
</ul>
</div>
</div>
<!--服务类目-->
<div class="cooperation">
<div class="cooperation-form-box">
<b class="arrow"></b>
<div class="box">
<p class="title">咨询合作 / 获取报价</p>
<p class="tip">请填写以下信息,我们会尽快与您联系。您提</p>
<div class="cooperation-form layui-form">
<div class="row bothSide verCenter" style="margin-bottom: 20px;">
<div class="column form-input">
<label>您的姓名:</label>
<input type="text" placeholder="" class="inp">
</div>
<div class="column form-input">
<label>联系方式:</label>
<input type="text" placeholder="" class="inp">
</div>
</div>
<div class="column form-input" style="margin-bottom: 20px;">
<label>您的需求:</label>
<div>
<input type="checkbox" title="国际海运" />
<input type="checkbox" title="国际空运" />
<input type="checkbox" title="国际陆运" />
<input type="checkbox" title="国际铁路" />
</div>
</div>
<div class="textared-box">
<textarea></textarea>
</div>
<a href="javascript:;" class="btn row rowCenter verCenter">提交</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/layui/layui.js"></script>
<script type="text/javascript" src="js/wow.min.js"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment