...
升级步骤参考 https://y2ova1.axshare.com
整体图片素材：
2、6.0自定义内容区域代码
2.1、默认代码样式
| 代码块 |
|---|
|
<!-- 新手引导 三列 -->
<div class="v5-guide effect-fade cols-3">
<h2 class="title-text text-1-cl">{{locale.home.custom_text1}}</h2>
<div class="title-tip text-2-cl">{{locale.home.custom_text2}}</div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="{{sourceMap.home_guide_1}}" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">{{locale.home.custom_text3}}</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="{{sourceMap.home_guide_2}}" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">{{locale.home.custom_text4}}</dd>
</dl>
<dl class="guide-item item-3">
<dt>
<img src="{{sourceMap.home_guide_3}}" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">{{locale.home.custom_text5}}</dd>
</dl>
</div>
</div>
<!-- 新手引导 二列 -->
<div class="v5-guide effect-fade cols-2">
<h2 class="title-text text-1-cl">{{locale.home.custom_text1}}</h2>
<div class="title-tip text-2-cl">{{locale.home.custom_text2}}</div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="{{sourceMap.home_guide_4}}" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">{{locale.home.custom_text3}}</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="{{sourceMap.home_guide_5}}" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">{{locale.home.custom_text4}}</dd>
</dl>
</div>
</div>
<!-- 服务支持 一排 -->
<div class="v5-service effect-fade rows-1">
<h2 class="title-text text-1-cl">{{locale.home.custom_text14}}</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="{{sourceMap.home_service_1}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text15}}</div>
<span class="text-2-cl">{{locale.home.custom_text16}}</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="{{sourceMap.home_service_2}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text17}}</div>
<span class="text-2-cl">{{locale.home.custom_text18}}</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="{{sourceMap.home_service_3}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text19}}</div>
<span class="text-2-cl">{{locale.home.custom_text20}}</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="{{sourceMap.home_service_4}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text21}}</div>
<span class="text-2-cl">{{locale.home.custom_text22}}</span>
</dd>
</dl>
</div>
</div>
<!-- 服务支持 二排 -->
<div class="v5-service effect-fade rows-2">
<h2 class="title-text text-1-cl">{{locale.home.custom_text14}}</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="{{sourceMap.home_service_1}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text15}}</div>
<span class="text-2-cl">{{locale.home.custom_text16}}</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="{{sourceMap.home_service_3}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text19}}</div>
<span class="text-2-cl">{{locale.home.custom_text20}}</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="{{sourceMap.home_service_4}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text21}}</div>
<span class="text-2-cl">{{locale.home.custom_text22}}</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="{{sourceMap.home_service_2}}" alt=""></dt>
<dd>
<div class="text-1-cl">{{locale.home.custom_text17}}</div>
<span class="text-2-cl">{{locale.home.custom_text18}}</span>
</dd>
</dl>
</div>
</div>
<!-- 邀请奖励 文字左侧 -->
<div class="v5-invite effect-fade text-left">
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>{{locale.home.custom_text29}}</div>
<div>{{locale.home.custom_text30}}</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
{{locale.home.custom_text31}}
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
{{locale.home.custom_text27}}
</a>
</div>
<div class="invite-img">
<img src="{{sourceMap.home_invite_1}}" alt="">
</div>
</div>
<!-- 邀请奖励 文字右侧 -->
<div class="v5-invite effect-fade text-right">
<div class="invite-img">
<img src="{{sourceMap.home_invite_1}}" alt="">
</div>
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>{{locale.home.custom_text29}}</div>
<div>{{locale.home.custom_text30}}</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
{{locale.home.custom_text31}}
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
{{locale.home.custom_text27}}
</a>
</div>
</div>
<!-- 功能支持 三列 -->
<div class="v5-features effect-fade cols-3">
<h2 class="title-text text-1-cl">{{locale.home.custom_text32}}</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">{{locale.home.custom_text33}}</div>
<div class="features-sub_text text-2-cl">{{locale.home.custom_text34}}</div>
</div>
<div class="features-img">
<img src="{{sourceMap.home_feature_1}}" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">{{locale.home.custom_text35}}</div>
<div class="features-sub_text text-2-cl">{{locale.home.custom_text36}}</div>
</div>
<div class="features-img">
<img src="{{sourceMap.home_feature_2}}" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">{{locale.home.custom_text37}}</div>
<div class="features-sub_text text-2-cl">{{locale.home.custom_text38}}</div>
</div>
<div class="features-img">
<img src="{{sourceMap.home_feature_3}}" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- 功能支持 二列 -->
<div class="v5-features effect-fade cols-2">
<h2 class="title-text text-1-cl">{{locale.home.custom_text32}}</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">{{locale.home.custom_text33}}</div>
<div class="features-sub_text text-2-cl">{{locale.home.custom_text34}}</div>
</div>
<div class="features-img">
<img src="{{sourceMap.home_feature_4}}" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">{{locale.home.custom_text35}}</div>
<div class="features-sub_text text-2-cl">{{locale.home.custom_text36}}</div>
</div>
<div class="features-img">
<img src="{{sourceMap.home_feature_5}}" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- APP下载 图片右侧 -->
<div class="v5-appDownload effect-fade img-right">
<div class="app-introduce">
<h2 class="title-text text-1-cl">{{locale.home.custom_text6}}</h2>
<div class="title-tip text-2-cl">{{locale.home.custom_text7}}</div>
<ul class="intro-list">
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">{{locale.home.custom_text8}}</p>
<span class="text-2-cl">{{locale.home.custom_text9}}</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">{{locale.home.custom_text10}}</p>
<span class="text-2-cl">{{locale.home.custom_text11}}</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">{{locale.home.custom_text12}}</p>
<span class="text-2-cl">{{locale.home.custom_text13}}</span>
</div>
</li>
</ul>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="{{sourceMap.home_download_1}}" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="{{sourceMap.home_download_2}}" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<div class="qrcode">
<div class="qrcode-icon">
<img src="{{sourceMap.home_download_3}}" alt="">
<div class="hover-layout"></div>
</div>
<aside class="qrcode-preview text-1-bg box-shadow">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</aside>
</div>
</div>
</div>
<div class="app-preview">
<img src="{{sourceMap.home_appview_1}}" alt="">
</div>
</div>
<!-- APP下载 图片左侧 -->
<div class="v5-appDownload effect-fade img-left">
<div class="app-preview">
<img src="{{sourceMap.home_appview_3}}" alt="">
</div>
<div class="app-introduce">
<h2 class="title-text text-1-cl">{{locale.home.custom_text6}}</h2>
<div class="title-tip text-2-cl">{{locale.home.custom_text7}}</div>
<div class="qrcode-img fill-5-bd">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</div>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="{{sourceMap.home_download_1}}" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="{{sourceMap.home_download_2}}" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
</div>
<!-- 注册引导 换色 -->
<div class="v5-register-guide transparentColor effect-fade">
<div class="register-guide-content" style="background-image: url('{{sourceMap.home_register_1}}');">
<h2 class="title-text text-1-cl">{{locale.home.custom_text25}}</h2>
<div class="title-text-sub text-1-cl">{{locale.home.custom_text26}}</div>
<a href="/register" class="main-1-bg link-href text-4-cl">
<span class="link-href_text">{{locale.home.custom_text27}}</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
<!-- 注册引导 主色 -->
<div class="v5-register-guide mainColor effect-fade">
<div class="register-guide-content" style="background-image: url('{{sourceMap.home_register_2}}');">
<h2 class="title-text text-4-cl">{{locale.home.custom_text25}}</h2>
<div class="title-text-sub text-4-cl">{{locale.home.custom_text26}}</div>
<a href="/register" class="text-4-bg link-href text-5-cl">
<span class="link-href_text">{{locale.home.custom_text27}}</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div> |
3、首页素材
...
2.
...
2、中文默认文案样式
...
...
...
|
<!-- 新手引导 三列 -->
<div class="v5-guide effect-fade cols-3">
<h2 class="title-text text-1-cl">新手引导</h2>
<div class="title-tip text-2-cl">即可开启数字货币交易学习</div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/292eb65d500b808700500ea53afa2cbb.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">快速了解法币交易</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/f97f2cecaa83ea83b49202e6868b9bd2.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">如何购买数字货币</dd>
</dl>
<dl class="guide-item item-3">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bb84383699c85cdc01ee114dcb410fc1.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">如何出售数字货币</dd>
</dl>
</div>
</div>
<!-- 新手引导 二列 -->
<div class="v5-guide effect-fade cols-2">
<h2 class="title-text text-1-cl">新手引导</h2>
<div class="title-tip text-2-cl">即可开启数字货币交易学习</div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/158e985d1233f1b58dcdf083bcf76ae2.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">快速了解法币交易</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/c2dca1b12339f690ffacfa22c6597206.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">如何购买数字货币</dd>
</dl>
</div>
</div>
<!-- 服务支持 一排 -->
<div class="v5-service effect-fade rows-1">
<h2 class="title-text text-1-cl">开启你的数字货币之旅</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/050ada765b457b81fa717615403b790f.png" alt=""></dt>
<dd>
<div class="text-1-cl">最低的手续费</div>
<span class="text-2-cl">最低的手续费，最快捷的交易，强劲的 API 以及更多</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bc196b083f714f5ef7dcb788be4b1b05.png" alt=""></dt>
<dd>
<div class="text-1-cl">最优的交易费率</div>
<span class="text-2-cl">优惠的交易费率，富有竞争力的VIP权益，享受最优品质服务</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/ebfb0fb8ef0cc045ca7751ff1fbc5600.png" alt=""></dt>
<dd>
<div class="text-1-cl">可信赖的安全保障</div>
<span class="text-2-cl">我们复杂的安全措施保护您的数字资产免受所有风险</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/15346dd141d121d1c95e513f5d485f5f.png" alt=""></dt>
<dd>
<div class="text-1-cl">24*7小时客服支持</div>
<span class="text-2-cl">24*7小时全天候、全日制运营模式，第一时间为您解答相关咨询。</span>
</dd>
</dl>
</div>
</div>
<!-- 服务支持 二排 -->
<div class="v5-service effect-fade rows-2">
<h2 class="title-text text-1-cl">开启你的数字货币之旅</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/050ada765b457b81fa717615403b790f.png" alt=""></dt>
<dd>
<div class="text-1-cl">最低的手续费</div>
<span class="text-2-cl">最低的手续费，最快捷的交易，强劲的 API 以及更多</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/ebfb0fb8ef0cc045ca7751ff1fbc5600.png" alt=""></dt>
<dd>
<div class="text-1-cl">可信赖的安全保障</div>
<span class="text-2-cl">我们复杂的安全措施保护您的数字资产免受所有风险</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/15346dd141d121d1c95e513f5d485f5f.png" alt=""></dt>
<dd>
<div class="text-1-cl">24*7小时客服支持</div>
<span class="text-2-cl">24*7小时全天候、全日制运营模式，第一时间为您解答相关咨询。</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bc196b083f714f5ef7dcb788be4b1b05.png" alt=""></dt>
<dd>
<div class="text-1-cl">最优的交易费率</div>
<span class="text-2-cl">优惠的交易费率，富有竞争力的VIP权益，享受最优品质服务</span>
</dd>
</dl>
</div>
</div>
<!-- 邀请奖励 文字左侧 -->
<div class="v5-invite effect-fade text-left">
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>邀请好友</div>
<div>获取奖励</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
享受全新奖励中心，赢取更多USDT！
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
邀请好友
</a>
</div>
<div class="invite-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/727d081b49e1db13958c61eafd6ac93f.png" alt="">
</div>
</div>
<!-- 邀请奖励 文字右侧 -->
<div class="v5-invite effect-fade text-right">
<div class="invite-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/727d081b49e1db13958c61eafd6ac93f.png" alt="">
</div>
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>邀请好友</div>
<div>获取奖励</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
享受全新奖励中心，赢取更多USDT！
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
邀请好友
</a>
</div>
</div>
<!-- 功能支持 三列 -->
<div class="v5-features effect-fade cols-3">
<h2 class="title-text text-1-cl">探索无限可能</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">跟单</div>
<div class="features-sub_text text-2-cl">交易专家、精准策略、前沿观点，让你的资产在市场波动中不断增值。</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-accelerate.aliyuncs.com/upload/99a3fb0cda700db7177e61de61f62cc3.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">选择交易所支付，助力企业成长</div>
<div class="features-sub_text text-2-cl">凭借无国界支付技术提供加密货币收付款功能，触达更多客户。</div>
</div>
<div class="features-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/8ea18c0e62ccdd863b0baf359eede336.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">理财</div>
<div class="features-sub_text text-2-cl">持有加密货币资金，赚取可观收益。</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-cn-hongkong.aliyuncs.com/transfer_dev/upload/8fa4520bf645900016d66286a105318a.png" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- 功能支持 二列 -->
<div class="v5-features effect-fade cols-2">
<h2 class="title-text text-1-cl">探索无限可能</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">跟单</div>
<div class="features-sub_text text-2-cl">交易专家、精准策略、前沿观点，让你的资产在市场波动中不断增值。</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-accelerate.aliyuncs.com/upload/1004af897a969e4e91b521f16bbe376e.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">交易专家、精准策略、前沿观点，让你的资产在市场波动中不断增值。</div>
<div class="features-sub_text text-2-cl">凭借无国界支付技术提供加密货币收付款功能，触达更多客户。</div>
</div>
<div class="features-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/88caa6c83dd40b01883963276b50d605.png" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- APP下载 图片右侧 -->
<div class="v5-appDownload effect-fade img-right">
<div class="app-introduce">
<h2 class="title-text text-1-cl">随时随地交易</h2>
<div class="title-tip text-2-cl">立即下载APP，所有交易尽在手中。</div>
<ul class="intro-list">
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">快速交易</p>
<span class="text-2-cl">提供多种交易类型选择，快速下单</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">自定义交易面板</p>
<span class="text-2-cl">根据不同交易习惯自由定义交易布局</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">轻松查看资产</p>
<span class="text-2-cl">E轻松转移账户中的资产，实时数字资产概览</span>
</div>
</li>
</ul>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/dbcccab91097cd6100c744927fdf975a.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/49ed8f98cf300a298903329838dfcb43.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<div class="qrcode">
<div class="qrcode-icon">
<img src="{{sourceMap.home_download_3}}" alt="">
<div class="hover-layout"></div>
</div>
<aside class="qrcode-preview text-1-bg box-shadow">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</aside>
</div>
</div>
</div>
<div class="app-preview">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/6ab4da591d9f52dbec19f56e3ed0661c.png" alt="">
</div>
</div>
<!-- APP下载 图片左侧 -->
<div class="v5-appDownload effect-fade img-left">
<div class="app-preview">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/cc9be28c951971588c84a3c731e3da4e.png" alt="">
</div>
<div class="app-introduce">
<h2 class="title-text text-1-cl">随时随地交易</h2>
<div class="title-tip text-2-cl">立即下载APP，所有交易尽在手中。</div>
<div class="qrcode-img fill-5-bd">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</div>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/dbcccab91097cd6100c744927fdf975a.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/49ed8f98cf300a298903329838dfcb43.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
</div>
<!-- 注册引导 换色 -->
<div class="v5-register-guide transparentColor effect-fade">
<div class="register-guide-content" style="background-image: url('https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/d97d3010ef107e9db9ca0961e570003f.png');">
<h2 class="title-text text-1-cl">马上开启交易之旅</h2>
<div class="title-text-sub text-1-cl">注册账号开始交易</div>
<a href="/register" class="main-1-bg link-href text-4-cl">
<span class="link-href_text">立即注册</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
<!-- 注册引导 主色 -->
<div class="v5-register-guide mainColor effect-fade">
<div class="register-guide-content" style="background-image: url('https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/5032e353317ea8a6ac5c2bb705c04558.png');">
<h2 class="title-text text-4-cl">马上开启交易之旅</h2>
<div class="title-text-sub text-4-cl">注册账号开始交易</div>
<a href="/register" class="text-4-bg link-href text-5-cl">
<span class="link-href_text">立即注册</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div> |
2.3、英文默认样式–带文案
| 代码块 |
|---|
|
<!-- 新手引导 三列 -->
<div class="v5-guide effect-fade cols-3">
<h2 class="title-text text-1-cl">Beginner's Guide </h2>
<div class="title-tip text-2-cl">You can start learning about digital currency trading </div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/292eb65d500b808700500ea53afa2cbb.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">Quickly understand fiat currency transactions in three minutes</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/f97f2cecaa83ea83b49202e6868b9bd2.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">How to buy digital currency </dd>
</dl>
<dl class="guide-item item-3">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bb84383699c85cdc01ee114dcb410fc1.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">How to sell numerical currency transactions</dd>
</dl>
</div>
</div>
<!-- 新手引导 二列 -->
<div class="v5-guide effect-fade cols-2">
<h2 class="title-text text-1-cl">Beginner's Guide</h2>
<div class="title-tip text-2-cl">You can start learning about digital currency trading</div>
<div class="guide-content">
<dl class="guide-item item-1">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/158e985d1233f1b58dcdf083bcf76ae2.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">Quickly understand fiat currency transactions in three minutes</dd>
</dl>
<dl class="guide-item item-2">
<dt>
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/c2dca1b12339f690ffacfa22c6597206.png" alt="">
<a href="javascript:void;" class="layout"></a>
</dt>
<dd class="text-1-cl">How to buy digital currency</dd>
</dl>
</div>
</div>
<!-- 服务支持 一排 -->
<div class="v5-service effect-fade rows-1">
<h2 class="title-text text-1-cl">Get In Touch. Stay In Touch.</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/050ada765b457b81fa717615403b790f.png" alt=""></dt>
<dd>
<div class="text-1-cl">0 fee digital currency trading</div>
<span class="text-2-cl">Multi-terminals are perfectly compatible to meet the transaction needs of various scenarios at any time</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bc196b083f714f5ef7dcb788be4b1b05.png" alt=""></dt>
<dd>
<div class="text-1-cl">Rich trading currencies</div>
<span class="text-2-cl">Support the transaction of 500+ currency assets</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/ebfb0fb8ef0cc045ca7751ff1fbc5600.png" alt=""></dt>
<dd>
<div class="text-1-cl">Rich gameplay</div>
<span class="text-2-cl">Support spot, legal currency, contracts, leveraged trading, ETF trading, etc.</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/15346dd141d121d1c95e513f5d485f5f.png" alt=""></dt>
<dd>
<div class="text-1-cl">24/7 Customer Support</div>
<span class="text-2-cl">Dedicated customer service to provide you with satisfactory customer service</span>
</dd>
</dl>
</div>
</div>
<!-- 服务支持 二排 -->
<div class="v5-service effect-fade rows-2">
<h2 class="title-text text-1-cl">Get In Touch. Stay In Touch.</h2>
<div class="service-content">
<dl class="service-item item-1">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/050ada765b457b81fa717615403b790f.png" alt=""></dt>
<dd>
<div class="text-1-cl">0 fee digital currency trading</div>
<span class="text-2-cl">Multi-terminals are perfectly compatible to meet the transaction needs of various scenarios at any time</span>
</dd>
</dl>
<dl class="service-item item-3">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/ebfb0fb8ef0cc045ca7751ff1fbc5600.png" alt=""></dt>
<dd>
<div class="text-1-cl">Rich gameplay</div>
<span class="text-2-cl">Support spot, legal currency, contracts, leveraged trading, ETF trading, etc.</span>
</dd>
</dl>
<dl class="service-item item-4">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/15346dd141d121d1c95e513f5d485f5f.png" alt=""></dt>
<dd>
<div class="text-1-cl">24/7 Customer Support</div>
<span class="text-2-cl">Dedicated customer service to provide you with satisfactory customer service</span>
</dd>
</dl>
<dl class="service-item item-2">
<dt><img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/bc196b083f714f5ef7dcb788be4b1b05.png" alt=""></dt>
<dd>
<div class="text-1-cl">Rich trading currencies</div>
<span class="text-2-cl">Support the transaction of 500+ currency assets</span>
</dd>
</dl>
</div>
</div>
<!-- 邀请奖励 文字左侧 -->
<div class="v5-invite effect-fade text-left">
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>Invite Friends</div>
<div>Enjoy Rewards</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
Rewarding. Transparent. Instant Redemption
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
Register Now
</a>
</div>
<div class="invite-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/727d081b49e1db13958c61eafd6ac93f.png" alt="">
</div>
</div>
<!-- 邀请奖励 文字右侧 -->
<div class="v5-invite effect-fade text-right">
<div class="invite-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/727d081b49e1db13958c61eafd6ac93f.png" alt="">
</div>
<div class="invite-text">
<h2 class="title-text text-1-cl">
<div>Invite Friends</div>
<div>Enjoy Rewards</div>
</h2>
<div class="invite-text_subTitle text-2-cl">
Rewarding. Transparent. Instant Redemption
</div>
<a class="invite-button main-1-bg text-4-cl" href="/register">
Register Now
</a>
</div>
</div>
<!-- 功能支持 三列 -->
<div class="v5-features effect-fade cols-3">
<h2 class="title-text text-1-cl">Explore Endless Possibilities</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">Dive into the world of NFTs</div>
<div class="features-sub_text text-2-cl">Open rare Mystery Boxes, explore IGOs, Fan Tokens, and more with Exchnage NFT.</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-accelerate.aliyuncs.com/upload/99a3fb0cda700db7177e61de61f62cc3.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">Grow your business with Exchange Pay</div>
<div class="features-sub_text text-2-cl">Reach more customers as you pay and get paid in crypto with our borderless payment technology on Exchange Pay & Exchange Marketplace</div>
</div>
<div class="features-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/8ea18c0e62ccdd863b0baf359eede336.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">Exchange Earn</div>
<div class="features-sub_text text-2-cl">Hold your crypto funds and start earning</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-cn-hongkong.aliyuncs.com/transfer_dev/upload/8fa4520bf645900016d66286a105318a.png" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- 功能支持 二列 -->
<div class="v5-features effect-fade cols-2">
<h2 class="title-text text-1-cl">Explore Endless Possibilities</h2>
<ul class="features-list">
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">Dive into the world of NFTs</div>
<div class="features-sub_text text-2-cl">Open rare Mystery Boxes, explore IGOs, Fan Tokens, and more with Exchnage NFT.</div>
</div>
<div class="features-img">
<img src="https://saas-osss.oss-accelerate.aliyuncs.com/upload/1004af897a969e4e91b521f16bbe376e.png" alt="">
</div>
<div class="layout"></div>
</li>
<li class="features-item fill-3-bg">
<div class="features-text">
<div class="features-main_text text-1-cl">Grow your business with Exchange Pay</div>
<div class="features-sub_text text-2-cl">Reach more customers as you pay and get paid in crypto with our borderless payment technology on Exchange Pay & Exchange Marketplace</div>
</div>
<div class="features-img">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/88caa6c83dd40b01883963276b50d605.png" alt="">
</div>
<div class="layout"></div>
</li>
</ul>
</div>
<!-- APP下载 图片右侧 -->
<div class="v5-appDownload effect-fade img-right">
<div class="app-introduce">
<h2 class="title-text text-1-cl">Trade Anytime, Anywhere.</h2>
<div class="title-tip text-2-cl">Quality products for you</div>
<ul class="intro-list">
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">Lightning Trading Performance</p>
<span class="text-2-cl">Provides a variety of transaction types and quick order speed</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">Custom Trading Panel</p>
<span class="text-2-cl">Freely define trading layout according to different trading habits</span>
</div>
</li>
<li class="intro-item">
<svg aria-hidden="true" class="icon icon-24">
<use xlink:href="#icon-v5_6"></use>
</svg>
<div>
<p class="text-1-cl">Easy Asset Switching</p>
<span class="text-2-cl">Easily transfer assets in your account with real-time digital asset overview</span>
</div>
</li>
</ul>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/dbcccab91097cd6100c744927fdf975a.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/49ed8f98cf300a298903329838dfcb43.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<div class="qrcode">
<div class="qrcode-icon">
<img src="{{sourceMap.home_download_3}}" alt="">
<div class="hover-layout"></div>
</div>
<aside class="qrcode-preview text-1-bg box-shadow">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</aside>
</div>
</div>
</div>
<div class="app-preview">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/6ab4da591d9f52dbec19f56e3ed0661c.png" alt="">
</div>
</div>
<!-- APP下载 图片左侧 -->
<div class="v5-appDownload effect-fade img-left">
<div class="app-preview">
<img src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/cc9be28c951971588c84a3c731e3da4e.png" alt="">
</div>
<div class="app-introduce">
<h2 class="title-text text-1-cl">Trade Anytime, Anywhere</h2>
<div class="title-tip text-2-cl">Quality products for you</div>
<div class="qrcode-img fill-5-bd">
<img src="{{ appDownLoad.app_page_url }}" alt="">
</div>
<div class="download">
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/dbcccab91097cd6100c744927fdf975a.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
<a href="/appDownload">
<img class="download-store" src="https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/49ed8f98cf300a298903329838dfcb43.png" alt="">
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
</div>
<!-- 注册引导 换色 -->
<div class="v5-register-guide transparentColor effect-fade">
<div class="register-guide-content" style="background-image: url('https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/d97d3010ef107e9db9ca0961e570003f.png');">
<h2 class="title-text text-1-cl">Want To Start Trading Right Away?</h2>
<div class="title-text-sub text-1-cl">Register your account immediately and start trading</div>
<a href="/register" class="main-1-bg link-href text-4-cl">
<span class="link-href_text">Register Now</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div>
<!-- 注册引导 主色 -->
<div class="v5-register-guide mainColor effect-fade">
<div class="register-guide-content" style="background-image: url('https://saas-test-bucket-21.s3.ap-northeast-1.amazonaws.com/1411/upload/5032e353317ea8a6ac5c2bb705c04558.png');">
<h2 class="title-text text-4-cl">Want To Start Trading Right Away?</h2>
<div class="title-text-sub text-4-cl">Register your account immediately and start trading</div>
<a href="/register" class="text-4-bg link-href text-5-cl">
<span class="link-href_text">Register Now</span>
<span class="link-icon">→</span>
<div class="hover-layout"></div>
<div class="active-layout"></div>
</a>
</div>
</div> |
3、首页素材
3.1、导航菜单图标
3.2、导航菜单图标
3.3、新手引导
| View file |
|---|
| name | 导航下拉四套主题icon.zip |
|---|
| height | 150 |
|---|
|
3.2、导航菜单图标
3.3、新手引导
3.3、特色介绍
3.3、新手引导
3.3、新手引导
3.3、新手引导
3.3、新手引导
3.3、新手引导
3.3、新手引导
...
3.3、APP下载