Skip to content

W
www.fudou6.com
Commit 27a4a8a8 authored by superman's avatar superman
Browse files
Options

变更为express项目

parent a2a64c88
Hide whitespace changes
Inline Side-by-side
Showing with 3733 additions and 2157 deletions
HTML/aboutUs.html
View file @ 27a4a8a8
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../CSS/normalize.css"/>
<link rel="stylesheet" href="../CSS/styles.css"/>
</head>
<body>
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="about-us-banner clear">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="about-us-banner-bottom clear">
<h4>企业愿景</h4>
<hr/>
<p>通过自有的风控部门，严格审核项目背景，设计产品结构，同时搭建涵盖APP、微信、网站等多端口的互联网平台，通过科技金融与移动互联网技术，将信息流、业务流整合，让理财师轻松获取需要的优质金融产品，真正为客户提供资产配置服务。</p>
</div>
<div class="company-introduction clear">
<h2><b></b>股东背景</h2>
<ul class="clear">
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
</ul>
<h2><b></b>合作伙伴</h2>
<div>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
</div>
</div>
<div class="address-map">
<div class="clear">
<div>
<span><img src="../imgs/about_us/icon01.png"/></span>
<h4>杭州枢纽科技</h4>
<hr/>
<p>浙江省杭州市余杭区良睦路1299号 互联网村5-305</p>
<h3>400-888-8888</h3>
</div>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../public/stylesheets/normalize.less"/>
<link rel="stylesheet" href="../public/stylesheets/styles.css"/>
</head>
<body>
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../public/images/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="about-us-banner clear">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="about-us-banner-bottom clear">
<h4>企业愿景</h4>
<hr/>
<p>通过自有的风控部门，严格审核项目背景，设计产品结构，同时搭建涵盖APP、微信、网站等多端口的互联网平台，通过科技金融与移动互联网技术，将信息流、业务流整合，让理财师轻松获取需要的优质金融产品，真正为客户提供资产配置服务。</p>
</div>
<div class="company-introduction clear">
<h2><b></b>股东背景</h2>
<ul class="clear">
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
<li class="fl">
<h4>林俊贤</h4>
<h6>金融理财师</h6>
<p>MBA，上海财经大学工商管理硕士学位。曾任联合证券有限公司自营业务投资经理，东新国际投资管理有限公司股票基金经理。拥有15年证券从业经历。通过他的积极管理，东新公司在过去4年较为恶劣的市场环境中，仍然获得了及其良好的全球投资表现。</p>
</li>
</ul>
<h2><b></b>合作伙伴</h2>
<div>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
<a href="javascrpt:;"></a>
</div>
</div>
<div class="address-map">
<div class="clear">
<div>
<span><img src="../public/images/about_us/icon01.png"/></span>
<h4>杭州枢纽科技</h4>
<hr/>
<p>浙江省杭州市余杭区良睦路1299号 互联网村5-305</p>
<h3>400-888-8888</h3>
</div>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
</body>
</html>
HTML/hotProject.html
View file @ 27a4a8a8
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../CSS/normalize.css"/>
<link rel="stylesheet" href="../CSS/styles.css" />
</head>
<body>
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div class="modal-box">
<div class="modal-dialog">
<h4>中电投先融-西安灞桥</h4>
<h3>180天 </h3>
<h6>基础设施类</h6>
<p>认购光大信托计划，用于“绿源公司”发放信托贷款，用于建设西安绿源农产品批发市场项目</p>
<img src="../imgs/hot_project/success.jpg">
<b id="modalBoxHidden">&times;</b>
</div>
</div>
<div id="section">
<div class="hot-project-banner clear">
<h4>富豆优投是枢纽科技旗下</h4>
<p>专为地方性项目或企业提供有保障的融资渠道、<br/>合理对投资资金需求的互联网平台，<br/>拥有数个大型项目资金问题解决方案</p>
</div>
<div class="hot-project-introducer">
<ul class="clear">
<li class="fl">
<i></i>
<b></b>
<span>债权融资</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>项目融资</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>融资租赁</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>扩展融资渠道</span>
</li>
</ul>
<hr/>
<div class="introducer">
<form id="introducer">
<h4>寻找优质项目介绍人</h4>
<div>
<span>联系方式：</span>
<input type="text" id="introducerMobile" name="introducer-mobile" placeholder="填写您的联系方式" maxlength="11"/>
</div>
<p class="error-phone"></p>
<div>
<span>项目描述：</span>
<textarea name="project-description" id="projectDescription" placeholder="详细写明您的项目需求 例如：项目时间、内容、合作意向。"></textarea>
</div>
<p class="error-description"></p>
<div><input type="submit" value="立即提交" disabled id="submit"/></div>
</form>
</div>
</div>
<div class="hot-project-address">
<div class="hot-project-address-box">
<div>
<h4>热点项目</h4>
<p>※国内各地在进行项目分布图</p>
</div>
</div>
</div>
<div class="hot-project-tabs clear">
<ul class="clear">
<li class="fl">
<dl>
<dt></dt>
<dd><h4>海量资金</h4></dd>
<dd>20多万资金方</dd>
<dd>3万亿资金，快速融资</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>安全可靠</h4></dd>
<dd>以对项目质量的严格把控。</dd>
<dd>和清晰的流程设计</dd>
<dd>让合投更规范、高效</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>融资高效</h4></dd>
<dd>多个大型项目经验，</dd>
<dd>融资流程</dd>
<dd>简单\迅速\到账快捷</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>专业服务</h4></dd>
<dd>专业的投资团队，</dd>
<dd>全程免费的投融资指导，</dd>
<dd>精准的对接推荐</dd>
</dl>
</li>
</ul>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../JS/jquery-1.8.3.min.js"></script>
<script src="../JS/hotProject.js"></script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../public/stylesheets/normalize.less"/>
<link rel="stylesheet" href="../public/stylesheets/styles.css" />
</head>
<body>
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../public/images/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div class="modal-box">
<div class="modal-dialog">
<h4>中电投先融-西安灞桥</h4>
<h3>180天 </h3>
<h6>基础设施类</h6>
<p>认购光大信托计划，用于“绿源公司”发放信托贷款，用于建设西安绿源农产品批发市场项目</p>
<img src="../public/images/hot_project/success.jpg">
<b id="modalBoxHidden">&times;</b>
</div>
</div>
<div id="section">
<div class="hot-project-banner clear">
<h4>富豆优投是枢纽科技旗下</h4>
<p>专为地方性项目或企业提供有保障的融资渠道、<br/>合理对投资资金需求的互联网平台，<br/>拥有数个大型项目资金问题解决方案</p>
</div>
<div class="hot-project-introducer">
<ul class="clear">
<li class="fl">
<i></i>
<b></b>
<span>债权融资</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>项目融资</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>融资租赁</span>
</li>
<li class="fl">
<i></i>
<b></b>
<span>扩展融资渠道</span>
</li>
</ul>
<hr/>
<div class="introducer">
<form id="introducer">
<h4>寻找优质项目介绍人</h4>
<div>
<span>联系方式：</span>
<input type="text" id="introducerMobile" name="introducer-mobile" placeholder="填写您的联系方式" maxlength="11"/>
</div>
<p class="error-phone"></p>
<div>
<span>项目描述：</span>
<textarea name="project-description" id="projectDescription" placeholder="详细写明您的项目需求 例如：项目时间、内容、合作意向。"></textarea>
</div>
<p class="error-description"></p>
<div><input type="submit" value="立即提交" disabled id="submit"/></div>
</form>
</div>
</div>
<div class="hot-project-address">
<div class="hot-project-address-box">
<div>
<h4>热点项目</h4>
<p>※国内各地在进行项目分布图</p>
</div>
</div>
</div>
<div class="hot-project-tabs clear">
<ul class="clear">
<li class="fl">
<dl>
<dt></dt>
<dd><h4>海量资金</h4></dd>
<dd>20多万资金方</dd>
<dd>3万亿资金，快速融资</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>安全可靠</h4></dd>
<dd>以对项目质量的严格把控。</dd>
<dd>和清晰的流程设计</dd>
<dd>让合投更规范、高效</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>融资高效</h4></dd>
<dd>多个大型项目经验，</dd>
<dd>融资流程</dd>
<dd>简单\迅速\到账快捷</dd>
</dl>
</li>
<li class="fl">
<dl>
<dt></dt>
<dd><h4>专业服务</h4></dd>
<dd>专业的投资团队，</dd>
<dd>全程免费的投融资指导，</dd>
<dd>精准的对接推荐</dd>
</dl>
</li>
</ul>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../public/javascripts/jquery-1.8.3.min.js"></script>
<script src="../public/javascripts/hotProject.js"></script>
</body>
</html>
HTML/index.html
View file @ 27a4a8a8
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="icon" href="../imgs/favicon.ico"/>
<link rel="stylesheet" href="../CSS/normalize.css"/>
<link rel="stylesheet" href="../CSS/styles.css"/>
</head>
<body>
<!--v1.0版-->
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="banner">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>
以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="download">
<div class="download-top">
<ul class="icon-lists clear">
<li class="android">
<i class="icon iconfont">&#xe600;</i>
<b></b>
<span>下载Android版</span>
</li>
<li class="iphone">
<i class="icon iconfont">&#xe602;</i>
<b></b>
<span>下载iPhone版</span>
</li>
</ul>
<a href=""><img src="../imgs/index/QR_Code.jpg" alt=""><span>扫描下载富豆APP</span></a>
<img src="../imgs/index/iphone.png" alt="iphone" class="iphone-img">
<hr/>
</div>
<div class="download_bottom">
<ul>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000亿</h4>
<p>累计交易</p>
</div>
<div>
<dl>
<dt><img src="../imgs/index/picture_01.png" alt=""></dt>
<dd class="title">金融脱媒</dd>
<dd class="detail">一手资源，从融资方直接取得项目资源</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000位</h4>
<p>精英理财师数</p>
</div>
<div>
<dl>
<dt><img src="../imgs/index/picture_02.png" alt=""></dt>
<dd class="title">严格风控</dd>
<dd class="detail">原招商银行风控团队</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000款</h4>
<p>发行产品数</p>
</div>
<div>
<dl>
<dt><img src="../imgs/index/picture_03.png" alt=""></dt>
<dd class="title">快速结拥</dd>
<dd class="detail">新用户款到结拥</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>13亿</h4>
<p>累计发行佣金</p>
</div>
<div>
<dl>
<dt><img src="../imgs/index/picture_04.png" alt=""></dt>
<dd class="title">佣金超高</dd>
<dd class="detail">高于市场千八的佣金体系</dd>
</dl>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="projects">
<div class="projects-header">
<div class="fl"></div>
<p class="fl"><span>推荐优质项目 领取高额介绍费</span></p>
</div>
<div class="projects-content">
<div>
<ul class="project-intro">
</ul>
<img src="../imgs/index/computer.jpg" class="computer"/>
</div>
<div class="project-info clear">
<p class="project-img project-one fl"></p>
<div class="project-detail fr">
<h4>中电投西安</h4>
<i></i>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
<div><a href="">查看详情 &gt;</a></div>
</div>
</div>
<div class="project-info clear">
<p class="project-img project-two fl"></p>
<div class="project-detail fr">
<h4>中电投西安</h4>
<i></i>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
<div><a href="">查看详情 &gt;</a></div>
</div>
</div>
<div class="project-info clear ">
<div class="project-detail project-three fl mr50 project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
<div class="project-detail project-four fl mr50 project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
<div class="project-detail project-five fr project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../JS/jquery-1.8.3.min.js"></script>
<script src="../JS/index.js"></script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="icon" href="../public/favicon.ico"/>
<link rel="stylesheet" href="../public/stylesheets/normalize.less"/>
<link rel="stylesheet" href="../public/stylesheets/styles.css"/>
</head>
<body>
<!--v1.0版-->
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../public/images/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="banner">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>
以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="download">
<div class="download-top">
<ul class="icon-lists clear">
<li class="android">
<i class="icon iconfont">&#xe600;</i>
<b></b>
<span>下载Android版</span>
</li>
<li class="iphone">
<i class="icon iconfont">&#xe602;</i>
<b></b>
<span>下载iPhone版</span>
</li>
</ul>
<a href=""><img src="../public/images/index/QR_Code.jpg" alt=""><span>扫描下载富豆APP</span></a>
<img src="../public/images/index/iphone.png" alt="iphone" class="iphone-img">
<hr/>
</div>
<div class="download_bottom">
<ul>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000亿</h4>
<p>累计交易</p>
</div>
<div>
<dl>
<dt><img src="../public/images/index/picture_01.png" alt=""></dt>
<dd class="title">金融脱媒</dd>
<dd class="detail">一手资源，从融资方直接取得项目资源</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000位</h4>
<p>精英理财师数</p>
</div>
<div>
<dl>
<dt><img src="../public/images/index/picture_02.png" alt=""></dt>
<dd class="title">严格风控</dd>
<dd class="detail">原招商银行风控团队</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>1000款</h4>
<p>发行产品数</p>
</div>
<div>
<dl>
<dt><img src="../public/images/index/picture_03.png" alt=""></dt>
<dd class="title">快速结拥</dd>
<dd class="detail">新用户款到结拥</dd>
</dl>
</div>
</div>
</li>
<li class="fl">
<div class="fl-box">
<div>
<h4>13亿</h4>
<p>累计发行佣金</p>
</div>
<div>
<dl>
<dt><img src="../public/images/index/picture_04.png" alt=""></dt>
<dd class="title">佣金超高</dd>
<dd class="detail">高于市场千八的佣金体系</dd>
</dl>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="projects">
<div class="projects-header">
<div class="fl"></div>
<p class="fl"><span>推荐优质项目 领取高额介绍费</span></p>
</div>
<div class="projects-content">
<div>
<ul class="project-intro">
</ul>
<img src="../public/images/index/computer.jpg" class="computer"/>
</div>
<div class="project-info clear">
<p class="project-img project-one fl"></p>
<div class="project-detail fr">
<h4>中电投西安</h4>
<i></i>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
<div><a href="">查看详情 &gt;</a></div>
</div>
</div>
<div class="project-info clear">
<p class="project-img project-two fl"></p>
<div class="project-detail fr">
<h4>中电投西安</h4>
<i></i>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
<div><a href="">查看详情 &gt;</a></div>
</div>
</div>
<div class="project-info clear ">
<div class="project-detail project-three fl mr50 project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
<div class="project-detail project-four fl mr50 project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
<div class="project-detail project-five fr project-detail-sm">
<h4>中电投西安</h4>
<div><a href="">查看详情 &gt;</a></div>
<ul class="clear">
<li class="fl">
<p><b>28</b>天</p>
<span>募集耗时</span>
</li>
<li class="fl">
<p><b>4</b>亿</p>
<span>募集资金</span>
</li>
<li class="fl">
<p><b>8.5</b>%</p>
<span>最高收益</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../public/javascripts/jquery-1.8.3.min.js"></script>
<script src="../public/javascripts/index.js"></script>
</body>
</html>
HTML/product.html
View file @ 27a4a8a8
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../CSS/normalize.css"/>
<link rel="stylesheet" href="../CSS/styles.css" />
</head>
<body>
<!--v2.0版-->
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../imgs/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="banner">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="product-info">
<div class="product-intro">
<h4 class="product-info-title"><b></b>XX证券-贵州同仁证券</h4>
<table>
<thead>
<tr>
<td>认购金额</td>
<td>预期收益</td>
<td>返佣比例</td>
</tr>
</thead>
<tbody>
<tr>
<td>300万≤x<1000万</td>
<td class="profit"><span>6.4</span>%</td>
<td rowspan="2" class="noborder">
<a href="">登录富豆APP可见</a>
</td>
</tr>
<tr>
<td>1000万≤x</td>
<td class="profit"><span>6.2</span>%</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">
剩余额度：<span id="myBalance">200</span>万/<span id="total">2000</span>万
<p id="progressBar"><i></i></p>
</td>
</tr>
</tfoot>
</table>
<div>
<div class="huxian"></div>
<p>募集中</p>
</div>
</div>
<div class="product-appointment">
<h4 class="product-info-title"><b></b>在线预约</h4>
<p>留下联系方式我们帮您第一时间抢占稀缺额度</p>
<form id="form">
<input type="text" name="userName" placeholder="请填写您的姓名" id="userName"/>
<input type="text" name="userTel" placeholder="请填写手机号" id="userTel" maxlength="11"/>
<input type="submit" id="submit" value="提交"/>
</form>
<p id="errorName" class="fl"></p>
<p id="errorTel" class="fl"></p>
</div>
<div class="product-detail">
<h4 class="product-info-title"><b></b>产品详情</h4>
<table>
<tbody>
<tr>
<td class="product-detail-key bb br">产品名称</td>
<td class="product-detail-value bb">XX证券-贵州同仁证券</td>
</tr>
<tr>
<td class="bb br">产品类别</td>
<td class="bb">集合信托</td>
</tr>
<tr>
<td class="bb br">产品状态</td>
<td class="bb">募集中</td>
</tr>
<tr>
<td class="bb br">剩余额度</td>
<td class="bb">200万 / 2000万</td>
</tr>
<tr>
<td class="bb br">投资门槛</td>
<td class="bb">100万</td>
</tr>
<tr>
<td class="bb br">投资期限</td>
<td class="bb">3+2年</td>
</tr>
<tr>
<td class="bb br">投资领域</td>
<td class="bb">房地产类</td>
</tr>
<tr>
<td class="bb br">付息方式</td>
<td class="bb">半年付息</td>
</tr>
<tr>
<td class="bb br">融资方</td>
<td class="bb">XXX公司</td>
</tr>
<tr>
<td class="bb br">担保方</td>
<td class="bb">XXX公司</td>
</tr>
<tr>
<td class="bb br">募集时间</td>
<td class="bb">2016/06/24 12:22:22 — 2016/07/24 12:22:22</td>
</tr>
<tr>
<td class="bb br">资金用途</td>
<td class="bb">本合同项下的信托资金将由受托人纳入信托计划资金的范围，由受托人以自己的名义集合管理运用和处分，坚持稳健投资原则下获取利益最大化的理念，按照风险的权重，主要通过投资股权、股权收益权等方式，将信托资金投向民生工程、能源等行业的优质企业及项目，资金闲置期间，也可以债权、可转债、投资信托受益权的方式运用信托资金，或以有限合伙人身份加入专门从事投资业务的有限合伙企业等方式间接投资、于优质企业及项目，或投资于其他低风险且收益稳定、风险可控的产品及项目，以期为受益人获得良好的投资 收益。</td>
</tr>
<tr>
<td class="bb br">还款来源</td>
<td class="bb">中融信托主动管理项目下的投资回报。</td>
</tr>
<tr>
<td class="bb br">风控措施</td>
<td class="bb">1、信托资金投向限制：本信托计划项下信托资金不得用于资金拆入、对外担保；不得将资金运用于房地产领域，不得直接投资于债券正回购、QDII产品（代理客户境外理财产品）黄金期货等商品期货、股指期权、股票期权等产品以及法律禁止投资的领域、对象；<br>2、流动性支持：次级受益人在其与受托人签署的《信托合同》项下同时承诺，在本信托计划存续期间，受托人认为信托财产专户内的现金资产不足以支付对应的支付日预计支付的信托费用、信托税费及预计应予分配的信托收益/信托利益金额或受托人调整信托计划项下优先级信托资金和次级信托资金比例的，次级受益人应以其自有资金随时追加认购次级信托单位</td>
</tr>
<tr>
<td class="bb br">项目亮点</td>
<td class="bb">1、（从法律层面）《信托法》明确规定，信托公司因主动管理不善导致信托亏损，信托公司要付全责。所以主动管理型项目在任何一类信托项目中，它的受重视程度是最高的；<br>2、（从实力背景层面）主动管理型项目的融资主体就是信托公司，股东都是央企、国企、地方政府或者大型金融机构，所以信托公司作为融资主体比一般的实体企业都更具实力，况且在目前信托刚性兑付的大背景下，信托公司帮其他融资主体融的资金，在融资方不能按期兑付投资者本息的情况下，都是信托公司以自有资金垫付，然后再通过风控措施去处置抵押或者是质押物，而自主管理型信托融资主体是信托公司本身，信托项目到期信托公司更应该按时兑付投资者的本息，所以信托公司自主管理型项目是目前最安全的类型；</td>
</tr>
<tr>
<td class="br">募集账号</td>
<td>
<p>账户名：中融国际信托有限公司</p>
<p>账号：【1003 4702 7350 010035】</p>
<p>开户行：中国邮政储蓄银行有限责任公司黑龙江省分行直属支行</p>
<p>打款备注：xxx认购隆晟1号12个月</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../JS/jquery-1.8.3.min.js"></script>
<script src="../JS/product.js"></script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="stylesheet" href="../public/stylesheets/normalize.less"/>
<link rel="stylesheet" href="../public/stylesheets/styles.css" />
</head>
<body>
<!--v2.0版-->
<div id="header">
<!--暂时放在这里-->
<a href="index.html"><img src="../public/images/logo.png" alt="logo"></a>
<ul class="clear">
<li class="fl"><a href="index.html">首页 / HOME</a></li>
<li class="fl"><a href="product.html">项目合作 / PROJECT</a></li>
<li class="fl"><a href="hotProject.html">最新产品 / PRODUCT</a></li>
<li class="fl"><a href="aboutUs.html">关于我们 / ABOUT</a></li>
</ul>
</div>
<div id="section">
<div class="banner">
<div class="banner-box">
<h4>海量资源 轻松抢单</h4>
<p>以科技为手段，面向财富管理行业从业人员的运营服务提供商。匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。</p>
</div>
</div>
<div class="product-info">
<div class="product-intro">
<h4 class="product-info-title"><b></b>XX证券-贵州同仁证券</h4>
<table>
<thead>
<tr>
<td>认购金额</td>
<td>预期收益</td>
<td>返佣比例</td>
</tr>
</thead>
<tbody>
<tr>
<td>300万≤x<1000万</td>
<td class="profit"><span>6.4</span>%</td>
<td rowspan="2" class="noborder">
<a href="">登录富豆APP可见</a>
</td>
</tr>
<tr>
<td>1000万≤x</td>
<td class="profit"><span>6.2</span>%</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">
剩余额度：<span id="myBalance">200</span>万/<span id="total">2000</span>万
<p id="progressBar"><i></i></p>
</td>
</tr>
</tfoot>
</table>
<div>
<div class="huxian"></div>
<p>募集中</p>
</div>
</div>
<div class="product-appointment">
<h4 class="product-info-title"><b></b>在线预约</h4>
<p>留下联系方式我们帮您第一时间抢占稀缺额度</p>
<form id="form">
<input type="text" name="userName" placeholder="请填写您的姓名" id="userName"/>
<input type="text" name="userTel" placeholder="请填写手机号" id="userTel" maxlength="11"/>
<input type="submit" id="submit" value="提交"/>
</form>
<p id="errorName" class="fl"></p>
<p id="errorTel" class="fl"></p>
</div>
<div class="product-detail">
<h4 class="product-info-title"><b></b>产品详情</h4>
<table>
<tbody>
<tr>
<td class="product-detail-key bb br">产品名称</td>
<td class="product-detail-value bb">XX证券-贵州同仁证券</td>
</tr>
<tr>
<td class="bb br">产品类别</td>
<td class="bb">集合信托</td>
</tr>
<tr>
<td class="bb br">产品状态</td>
<td class="bb">募集中</td>
</tr>
<tr>
<td class="bb br">剩余额度</td>
<td class="bb">200万 / 2000万</td>
</tr>
<tr>
<td class="bb br">投资门槛</td>
<td class="bb">100万</td>
</tr>
<tr>
<td class="bb br">投资期限</td>
<td class="bb">3+2年</td>
</tr>
<tr>
<td class="bb br">投资领域</td>
<td class="bb">房地产类</td>
</tr>
<tr>
<td class="bb br">付息方式</td>
<td class="bb">半年付息</td>
</tr>
<tr>
<td class="bb br">融资方</td>
<td class="bb">XXX公司</td>
</tr>
<tr>
<td class="bb br">担保方</td>
<td class="bb">XXX公司</td>
</tr>
<tr>
<td class="bb br">募集时间</td>
<td class="bb">2016/06/24 12:22:22 — 2016/07/24 12:22:22</td>
</tr>
<tr>
<td class="bb br">资金用途</td>
<td class="bb">本合同项下的信托资金将由受托人纳入信托计划资金的范围，由受托人以自己的名义集合管理运用和处分，坚持稳健投资原则下获取利益最大化的理念，按照风险的权重，主要通过投资股权、股权收益权等方式，将信托资金投向民生工程、能源等行业的优质企业及项目，资金闲置期间，也可以债权、可转债、投资信托受益权的方式运用信托资金，或以有限合伙人身份加入专门从事投资业务的有限合伙企业等方式间接投资、于优质企业及项目，或投资于其他低风险且收益稳定、风险可控的产品及项目，以期为受益人获得良好的投资 收益。</td>
</tr>
<tr>
<td class="bb br">还款来源</td>
<td class="bb">中融信托主动管理项目下的投资回报。</td>
</tr>
<tr>
<td class="bb br">风控措施</td>
<td class="bb">1、信托资金投向限制：本信托计划项下信托资金不得用于资金拆入、对外担保；不得将资金运用于房地产领域，不得直接投资于债券正回购、QDII产品（代理客户境外理财产品）黄金期货等商品期货、股指期权、股票期权等产品以及法律禁止投资的领域、对象；<br>2、流动性支持：次级受益人在其与受托人签署的《信托合同》项下同时承诺，在本信托计划存续期间，受托人认为信托财产专户内的现金资产不足以支付对应的支付日预计支付的信托费用、信托税费及预计应予分配的信托收益/信托利益金额或受托人调整信托计划项下优先级信托资金和次级信托资金比例的，次级受益人应以其自有资金随时追加认购次级信托单位</td>
</tr>
<tr>
<td class="bb br">项目亮点</td>
<td class="bb">1、（从法律层面）《信托法》明确规定，信托公司因主动管理不善导致信托亏损，信托公司要付全责。所以主动管理型项目在任何一类信托项目中，它的受重视程度是最高的；<br>2、（从实力背景层面）主动管理型项目的融资主体就是信托公司，股东都是央企、国企、地方政府或者大型金融机构，所以信托公司作为融资主体比一般的实体企业都更具实力，况且在目前信托刚性兑付的大背景下，信托公司帮其他融资主体融的资金，在融资方不能按期兑付投资者本息的情况下，都是信托公司以自有资金垫付，然后再通过风控措施去处置抵押或者是质押物，而自主管理型信托融资主体是信托公司本身，信托项目到期信托公司更应该按时兑付投资者的本息，所以信托公司自主管理型项目是目前最安全的类型；</td>
</tr>
<tr>
<td class="br">募集账号</td>
<td>
<p>账户名：中融国际信托有限公司</p>
<p>账号：【1003 4702 7350 010035】</p>
<p>开户行：中国邮政储蓄银行有限责任公司黑龙江省分行直属支行</p>
<p>打款备注：xxx认购隆晟1号12个月</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="clear" id="footer">
<!--暂时放在这里-->
<p class="hotline">全国客服热线 9:30-18:30</p>
<h4>400-888-8888</h4>
<hr/>
<p class="address">浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="hr@shuniu.com">hr@shuniu.com</a></p>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</div>
<script src="../public/javascripts/jquery-1.8.3.min.js"></script>
<script src="../public/javascripts/product.js"></script>
</body>
</html>
app.js 0 → 100644
View file @ 27a4a8a8
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var handlebars = require('express-handlebars');
var routes = require('./routes/index');
var app = express();
// view engine setup
// app.set('views', path.join(__dirname, 'views'));
// app.set('view engine', 'jade');
app.engine('hbs', handlebars({
layoutsDir: 'views',
defaultLayout: 'layout',
extname: '.hbs'
}));
app.set('view engine', 'hbs');
// uncomment after placing your favicon in /public
app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
bin/www 0 → 100755
View file @ 27a4a8a8
#!/usr/bin/env node
/**
* Module dependencies.
*/
var app = require('../app');
var debug = require('debug')('www.fudou6.com:server');
var http = require('http');
/**
* Get port from environment and store in Express.
*/
var port = normalizePort(process.env.PORT || '3000');
app.set('port', port);
/**
* Create HTTP server.
*/
var server = http.createServer(app);
/**
* Listen on provided port, on all network interfaces.
*/
server.listen(port);
server.on('error', onError);
server.on('listening', onListening);
/**
* Normalize a port into a number, string, or false.
*/
function normalizePort(val) {
var port = parseInt(val, 10);
if (isNaN(port)) {
// named pipe
return val;
}
if (port >= 0) {
// port number
return port;
}
return false;
}
/**
* Event listener for HTTP server "error" event.
*/
function onError(error) {
if (error.syscall !== 'listen') {
throw error;
}
var bind = typeof port === 'string'
? 'Pipe ' + port
: 'Port ' + port;
// handle specific listen errors with friendly messages
switch (error.code) {
case 'EACCES':
console.error(bind + ' requires elevated privileges');
process.exit(1);
break;
case 'EADDRINUSE':
console.error(bind + ' is already in use');
process.exit(1);
break;
default:
throw error;
}
}
/**
* Event listener for HTTP server "listening" event.
*/
function onListening() {
var addr = server.address();
var bind = typeof addr === 'string'
? 'pipe ' + addr
: 'port ' + addr.port;
debug('Listening on ' + bind);
}
package.json 0 → 100644
View file @ 27a4a8a8
{
"name": "www.fudou6.com",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"body-parser": "~1.13.2",
"cookie-parser": "~1.3.5",
"debug": "~2.2.0",
"express": "~4.13.1",
"express-handlebars": "*",
"morgan": "~1.6.1",
"serve-favicon": "~2.3.0"
}
}
public/stylesheets/index.css 0 → 100644
View file @ 27a4a8a8
/*.banner begin*/
.banner {
background: url("/images/index/banner.jpg") no-repeat center center;
background-size: cover;
padding-top: 120px;
padding-bottom: 160px;
}
.banner .banner-box {
width: 1000px;
margin: 0 auto;
color: #fff;
}
.banner .banner-box h1 {
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
font-size: 64px;
}
.banner .banner-box p {
font-size: 20px;
line-height: 35px;
}
/*.banner end*/
/*.download begin*/
.download {
position: relative;
padding-top: 400px;
width: 1000px;
margin: 0 auto;
}
.download .android,
.download .iphone {
position: absolute;
left: 50%;
top: 140px;
margin-left: -467px;
height: 68px;
width: 268px;
line-height: 68px;
font-size: 18px;
border-radius: 4px;
}
.download .android i,
.download .iphone i {
display: inline-block;
height: 68px;
width: 68px;
margin-right: 22px;
font-size: 32px;
text-align: center;
color: #fff;
border-right: 1px solid rgba(255, 255, 255, 0.3);
}
.download .android {
background-color: #82b21c;
}
.download .iphone {
margin-top: 88px;
background-color: #0079c2;
}
.download .qr-code {
position: absolute;
top: 140px;
left: 50%;
margin-left: -150px;
text-align: center;
font-size: 14px;
}
.download .qr-code img {
display: block;
margin-bottom: 5px;
}
.download .app-screen {
position: absolute;
left: 50%;
top: -140px;
margin-left: 60px;
width: 405px;
height: 515px;
}
.download hr {
width: 95%;
}
/*download end*/
/*character begin*/
.character ul {
width: 1000px;
margin: 80px auto;
}
.character ul li {
float: left;
width: 25%;
height: 160px;
text-align: center;
position: relative;
}
.character ul li > div {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.character ul li > div:first-child h3 {
margin-top: 50px;
font-size: 44px;
color: #111d2b;
}
.character ul li > div:first-child h4 {
font-size: 16px;
color: #888;
}
.character ul li > div:last-child img {
display: block;
margin: auto;
}
.character ul li > div:last-child h3 {
font-size: 36px;
}
.character ul li > div:last-child h4 {
font-size: 14px;
}
/* character end */
/* projects begin */
.projects {
background-color: #f6f6f6;
}
.projects > header > div {
float: left;
height: 300px;
position: relative;
width: 50%;
}
.projects > header > div:first-child {
background-color: #111d2b;
}
.projects > header > div:first-child > div {
position: relative;
width: 300px;
margin-right: 200px;
float: right;
height: 300px;
}
.projects > header > div:first-child > div .logo {
position: absolute;
top: 50%;
right: 50px;
height: 94px;
width: 227px;
margin-top: -47px;
background: url(/images/index/icon_01.png) no-repeat;
background-size: cover;
}
.projects > header > div:last-child {
background-color: #2e2e2e;
}
.projects > header > div:last-child > div {
position: relative;
width: 700px;
margin-left: -200px;
background-color: #2e2e2e;
height: 300px;
}
.projects > header > div:last-child h3 {
position: absolute;
top: 50%;
left: 20px;
height: 80px;
padding-bottom: 45px;
margin-top: -64px;
font-size: 48px;
color: #fff;
background: url(/images/index/icon_02.jpg) no-repeat left bottom;
}
.projects > section {
width: 1000px;
height: 500px;
margin: 0 auto;
}
.projects > section > div:first-child {
width: 379px;
float: left;
margin-top: 50px;
margin-left: 20px;
border-right: 1px solid #7f7f7f;
}
.projects > section > div:first-child p {
position: relative;
margin-top: 20px;
font-size: 23px;
line-height: 30px;
color: #565656;
}
.projects > section > div:first-child p:before {
content: '·';
position: absolute;
left: -20px;
font-size: 50px;
top: -3px;
}
.projects > section > div:last-child {
width: 600px;
float: left;
position: relative;
}
.projects > section > div:last-child .computer {
position: absolute;
top: -80px;
right: 0;
width: 542px;
height: 483px;
background: url(/images/index/computer.jpg) no-repeat;
}
/* projects end*/
/*product begin*/
.products {
background-color: #f6f6f6;
}
.products ul {
width: 1000px;
margin: 0 auto;
}
.products ul li {
position: relative;
color: #fff;
}
.products ul li:nth-child(1),
.products ul li:nth-child(2) {
margin-bottom: 30px;
}
.products ul li:nth-child(1) > div,
.products ul li:nth-child(2) > div {
height: 400px;
float: left;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 650px;
-webkit-background-size: cover;
background-size: cover;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 320px;
margin-left: 30px;
background-color: #2e2e2e;
}
/*product end*/
public/stylesheets/index.less 0 → 100644
View file @ 27a4a8a8
@import 'variable';
/*.banner begin*/
.banner {
background: url("/images/index/banner.jpg") no-repeat center center;
background-size: cover;
padding-top: 120px;
padding-bottom: 160px;
.banner-box {
width: @container-width;
margin: 0 auto;
color: #fff;
h1 {
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
font-size: 64px;
}
p {
font-size: 20px;
line-height: 35px;
}
}
}
/*.banner end*/
/*.download begin*/
.download {
position: relative;
padding-top: 400px;
width: @container-width;
margin: 0 auto;
.android,
.iphone {
position: absolute;
left: 50%;
top: 140px;
margin-left: -467px;
height: 68px;
width: 268px;
line-height: 68px;
font-size: 18px;
border-radius: 4px;
i {
display: inline-block;
height: 68px;
width: 68px;
margin-right: 22px;
font-size: 32px;
text-align: center;
color: #fff;
border-right: 1px solid rgba(255, 255, 255, 0.3);
}
}
.android {
background-color: #82b21c;
}
.iphone {
margin-top: 88px;
background-color: #0079c2;
}
.qr-code {
position: absolute;
top: 140px;
left: 50%;
margin-left: -150px;
text-align: center;
font-size: 14px;
img {
display: block;
margin-bottom: 5px;
}
}
.app-screen {
position: absolute;
left: 50%;
top: -140px;
margin-left: 60px;
width: 405px;
height: 515px;
}
hr {
width: 95%;
}
}
/*download end*/
/*character begin*/
.character {
ul {
width: @container-width;
margin: 80px auto;
li {
float: left;
width: 25%;
height: 160px;
text-align: center;
position: relative;
& > div {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
&:first-child {
h3 {
margin-top: 50px;
font-size: 44px;
color: #111d2b;
}
h4 {
font-size: 16px;
color: #888;
}
}
&:last-child {
img {
display: block;
margin: auto;
}
h3 {
font-size: 36px;
}
h4 {
font-size: 14px;
}
}
}
}
}
}
/* character end */
/* projects begin */
.projects {
background-color: #f6f6f6;
& > header {
& > div {
float: left;
height: 300px;
position: relative;
width: 50%;
&:first-child {
background-color: #111d2b;
& > div {
position: relative;
width: @container-width/4 + 50;
margin-right: @container-width/4 - 50;
float: right;
height: 300px;
.logo {
position: absolute;
top: 50%;
right: 50px;
height: 94px;
width: 227px;
margin-top: -47px;
background: url(/images/index/icon_01.png) no-repeat;
background-size: cover;
}
}
}
&:last-child {
background-color: #2e2e2e;
& > div {
position: relative;
width: @container-width / 4 * 3 - 50;
margin-left: -@container-width/4 + 50;
background-color: #2e2e2e;
height: 300px;
}
h3 {
position: absolute;
top: 50%;
left: 20px;
height: 80px;
padding-bottom: 45px;
margin-top: -64px;
font-size: 48px;
color: #fff;
background: url(/images/index/icon_02.jpg) no-repeat left bottom;
}
}
}
}
& > section {
width: @container-width;
height: 500px;
margin: 0 auto;
& > div {
&:first-child {
width: @container-width/2-121;
float: left;
margin-top: 50px;
margin-left: 20px;
border-right: 1px solid #7f7f7f;
p {
position: relative;
margin-top: 20px;
font-size: 23px;
line-height: 30px;
color: #565656;
&:before {
content: '·';
position: absolute;
left: -20px;
font-size: 50px;
top: -3px;
}
}
}
&:last-child {
width: @container-width/2+100;
float: left;
position: relative;
.computer {
position: absolute;
top: -80px;
right: 0;
width: 542px;
height: 483px;
background: url(/images/index/computer.jpg) no-repeat;
}
}
}
}
}
/* projects end*/
/*product begin*/
.products {
background-color: #f6f6f6;
ul {
width: @container-width;
margin: 0 auto;
li {
position: relative;
color: #fff;
&:nth-child(1),
&:nth-child(2) {
margin-bottom: 30px;
& > div {
height: 400px;
float: left;
&:first-child {
width: @container-width/4*3-100;
-webkit-background-size: cover;
background-size: cover;
}
&:last-child {
width: @container-width/4+70;
margin-left: 30px;
background-color: #2e2e2e;
}
}
}
}
}
}
/*product end*/
public/stylesheets/style.css 0 → 100644
View file @ 27a4a8a8
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/**
* 1. Change the default font family in all browsers (opinionated).
* 2. Prevent adjustments of font size after orientation changes in IE and iOS.
*/
html {
font-family: sans-serif;
/* 1 */
-ms-text-size-adjust: 100%;
/* 2 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/**
* Remove the margin in all browsers (opinionated).
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Add the correct display in IE 9-.
* 1. Add the correct display in Edge, IE, and Firefox.
* 2. Add the correct display in IE.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
/* 1 */
display: block;
}
/**
* Add the correct display in IE 9-.
*/
audio,
canvas,
progress,
video {
display: inline-block;
}
/**
* Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Add the correct display in IE 10-.
* 1. Add the correct display in IE.
*/
template,
[hidden] {
display: none;
}
/* Links
========================================================================== */
/**
* 1. Remove the gray background on active links in IE 10.
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
background-color: transparent;
/* 1 */
-webkit-text-decoration-skip: objects;
/* 2 */
}
/**
* Remove the outline on focused links when they are also active or hovered
* in all browsers (opinionated).
*/
a:active,
a:hover {
outline-width: 0;
}
/* Text-level semantics
========================================================================== */
/**
* 1. Remove the bottom border in Firefox 39-.
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
/* 1 */
text-decoration: underline;
/* 2 */
text-decoration: underline dotted;
/* 2 */
}
/**
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
font-weight: inherit;
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* Add the correct font style in Android 4.3-.
*/
dfn {
font-style: italic;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Add the correct background and color in IE 9-.
*/
mark {
background-color: #ff0;
color: #000;
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
/**
* Hide the overflow in IE.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/* Forms
========================================================================== */
/**
* 1. Change font properties to `inherit` in all browsers (opinionated).
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
select,
textarea {
font: inherit;
/* 1 */
margin: 0;
/* 2 */
}
/**
* Restore the font weight unset by the previous rule.
*/
optgroup {
font-weight: bold;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
/* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
/* 1 */
text-transform: none;
}
/**
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
/* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Change the border, margin, and padding in all browsers (opinionated).
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */
padding: 0;
/* 3 */
white-space: normal;
/* 1 */
}
/**
* Remove the default vertical scrollbar in IE.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10-.
* 2. Remove the padding in IE 10-.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/**
* Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Correct the text style of placeholders in Chrome, Edge, and Safari.
*/
::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
@font-face {
font-family: "iconfont";
src: url('iconfont.eot?t=1469178729');
/* IE9*/
src: url('iconfont.eot?t=1469178729#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('iconfont.woff?t=1469178729') format('woff'), /* chrome, firefox */ url('iconfont.ttf?t=1469178729') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ url('iconfont.svg?t=1469178729#iconfont') format('svg');
/* iOS 4.1- */
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
.icon-android:before {
content: "\e600";
}
.icon-jieshao:before {
content: "\e601";
}
.icon-iphone:before {
content: "\e602";
}
.icon-weibo:before {
content: "\e603";
}
.icon-kefu:before {
content: "\e604";
}
.icon-weixin:before {
content: "\e605";
}
body {
font-family: Microsoft YaHei, simhei, Tahoma, Arial, sans-serif;
font-size: 14px;
line-height: 1.732;
}
ul,
ol {
list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
ul,
li,
b,
p,
dl,
dt,
dd {
margin: 0;
padding: 0;
font-weight: normal;
}
a {
text-decoration: none;
color: #000;
}
.clear:after {
content: '';
display: block;
clear: both;
}
.clear:before {
content: '';
display: table;
}
hr.line-separate {
position: relative;
width: 80%;
margin: 0 auto;
border: none;
border-bottom: 1px solid #8c8c8c;
}
hr.line-separate:after {
content: '';
position: absolute;
top: -1px;
left: 50%;
width: 72px;
height: 3px;
margin-left: -36px;
background: #8c8c8c;
}
/*header begin*/
#header .container {
width: 1000px;
margin: 0 auto;
position: relative;
}
#header .logo {
position: absolute;
top: 0;
left: 0;
z-index: 999;
}
#header nav {
padding-left: 250px;
font-size: 16px;
}
#header nav span {
float: left;
padding: 20px 0 10px;
margin-right: 30px;
}
#header nav span:last-child {
margin-right: 0;
}
#header nav a {
display: block;
color: #383838;
font-weight: bold;
padding: 10px;
border-bottom: 3px solid transparent;
}
#header nav a:hover,
#header nav a.active {
border-bottom-color: #000;
}
/*header end*/
/*footer begin*/
#footer {
padding: 60px 0 80px;
text-align: center;
background: #2e2e2e;
color: #fff;
font-size: 14px;
line-height: 26px;
}
#footer h3 {
font-size: 24px;
}
#footer h2 {
font-size: 60px;
font-weight: bold;
margin: 50px auto 30px;
}
#footer address {
margin-top: 60px;
font-style: normal;
}
#footer address,
#footer address a {
color: #00a4d8;
}
#footer .copyright {
color: #aeaeae;
}
#footer .copyright span {
color: #fff;
}
/*footer end*/
public/stylesheets/style.less 0 → 100644
View file @ 27a4a8a8
@import "normalize";
@import 'iconfont';
@import 'variable';
body {
font-family: Microsoft YaHei, simhei, Tahoma, Arial, sans-serif;
font-size: 14px;
line-height: 1.732;
}
ul, ol {
list-style: none;
}
h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
margin: 0;
padding: 0;
font-weight: normal;
}
a {
text-decoration: none;
color: #000;
}
.clear {
&:after {
content: '';
display: block;
clear: both;
}
&:before {
content: '';
display: table;
}
}
hr.line-separate {
position: relative;
width: 80%;
margin: 0 auto;
border: none;
border-bottom: 1px solid #8c8c8c;
&:after {
content: '';
position: absolute;
top: -1px;
left: 50%;
width: 72px;
height: 3px;
margin-left: -36px;
background: #8c8c8c;
}
}
/*header begin*/
#header {
.container {
width: @container-width;
margin: 0 auto;
position: relative;
}
.logo {
position: absolute;
top: 0;
left: 0;
z-index: 999;
}
nav {
padding-left: 250px;
font-size: 16px;
span {
float: left;
padding: 20px 0 10px;
margin-right: 30px;
&:last-child {
margin-right: 0;
}
}
a {
display: block;
color: #383838;
font-weight: bold;
padding: 10px;
border-bottom: 3px solid transparent;
&:hover,
&.active {
border-bottom-color: #000;
}
}
}
}
/*header end*/
/*footer begin*/
#footer {
padding: 60px 0 80px;
text-align: center;
background: #2e2e2e;
color: #fff;
font-size: 14px;
line-height: 26px;
h3 {
font-size: 24px;
}
h2 {
font-size: 60px;
font-weight: bold;
margin: 50px auto 30px;
}
address {
margin-top: 60px;
font-style: normal;
&, a {
color: #00a4d8;
}
}
.copyright {
color: #aeaeae;
span {
color: #fff;
}
}
}
/*footer end*/
CSS/styles.css → public/stylesheets/styles.css
View file @ 27a4a8a8
......@@ -200,7 +200,7 @@ dd {
width: 100%;
}
.banner {
background: url("../imgs/index/banner.jpg") no-repeat center center;
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
}
.banner .banner-box {
......@@ -447,12 +447,12 @@ dd {
padding: 0;
width: 25%;
height: 100%;
background: #111d2b url("../imgs/index/icon_01.png") no-repeat 43% 86px;
background: #111d2b url("../images/index/icon_01.png") no-repeat 43% 86px;
}
.projects .projects-header p {
width: 75%;
height: 100%;
background: #2e2e2e url("../imgs/index/icon_02.jpg") no-repeat 58px 170px;
background: #2e2e2e url("../images/index/icon_02.jpg") no-repeat 58px 170px;
font-size: 48px;
color: #fff;
}
......@@ -494,11 +494,11 @@ dd {
background: #faf;
}
.projects .projects-content .project-info .project-one {
background: url("../imgs/index/528ad57.jpg") no-repeat center center;
background: url("../images/index/528ad57.jpg") no-repeat center center;
background-size: cover;
}
.projects .projects-content .project-info .project-two {
background: url("../imgs/index/041c0cc.jpg") no-repeat center center;
background: url("../images/index/041c0cc.jpg") no-repeat center center;
background-size: cover;
}
.projects .projects-content .project-info .mr50 {
......@@ -548,15 +548,15 @@ dd {
height: 366px;
}
.projects .projects-content .project-info .project-three {
background: #fff url("../imgs/index/fcfbb08.jpg") no-repeat center center;
background: #fff url("../images/index/fcfbb08.jpg") no-repeat center center;
background-size: cover;
}
.projects .projects-content .project-info .project-four {
background: #fff url("../imgs/index/5ce7cf8.jpg") no-repeat center center;
background: #fff url("../images/index/5ce7cf8.jpg") no-repeat center center;
background-size: cover;
}
.projects .projects-content .project-info .project-five {
background: #fff url("../imgs/index/38be78d.jpg") no-repeat center center;
background: #fff url("../images/index/38be78d.jpg") no-repeat center center;
background-size: cover;
}
/*产品详情页面*/
......@@ -771,7 +771,7 @@ dd {
.hot-project-banner {
height: 600px;
width: 100%;
background: url('../imgs/hot_project/hot_project_banner.jpg') no-repeat center center;
background: url('../images/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
......@@ -791,7 +791,7 @@ dd {
.hot-project-banner {
height: 470px;
width: 100%;
background: url('../imgs/hot_project/hot_project_banner.jpg') no-repeat center center;
background: url('../images/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
......@@ -841,7 +841,7 @@ dd {
position: relative;
top: 20px;
margin-right: 6px;
background: url("../imgs/hot_project/tabs01.png") no-repeat -46px -13px;
background: url("../images/hot_project/tabs01.png") no-repeat -46px -13px;
}
.hot-project-introducer > ul li:nth-child(2) > b {
background-position: -176px -13px;
......@@ -1011,22 +1011,22 @@ dd {
border-right: 1px solid #43abb6;
}
.hot-project-tabs ul li:nth-child(1) dt {
background: url("../imgs/hot_project/tabs05_b.png") no-repeat;
background: url("../images/hot_project/tabs05_b.png") no-repeat;
}
.hot-project-tabs ul li:nth-child(2) {
border-right: 1px solid #43abb6;
}
.hot-project-tabs ul li:nth-child(2) dt {
background: url("../imgs/hot_project/tabs04_b.png") no-repeat;
background: url("../images/hot_project/tabs04_b.png") no-repeat;
}
.hot-project-tabs ul li:nth-child(3) {
border-right: 1px solid #43abb6;
}
.hot-project-tabs ul li:nth-child(3) dt {
background: url("../imgs/hot_project/tabs03_b.png") no-repeat;
background: url("../images/hot_project/tabs03_b.png") no-repeat;
}
.hot-project-tabs ul li:nth-child(4) dt {
background: url("../imgs/hot_project/tabs02_b.png") no-repeat;
background: url("../images/hot_project/tabs02_b.png") no-repeat;
}
.hot-project-tabs ul li:hover {
color: #fff;
......@@ -1038,13 +1038,13 @@ dd {
@-webkit-keyframes changeOne {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs05_b.png ") no-repeat;
background: url("../images/hot_project/tabs05_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs05_a.png ") no-repeat;
background: url("../images/hot_project/tabs05_a.png ") no-repeat;
opacity: 1;
}
}
......@@ -1056,13 +1056,13 @@ dd {
@-webkit-keyframes changeTwo {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs04_b.png ") no-repeat;
background: url("../images/hot_project/tabs04_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat -1px -1px;
background: url("../images/hot_project/tabs04_a.png ") no-repeat -1px -1px;
opacity: 1;
}
}
......@@ -1074,14 +1074,14 @@ dd {
@-webkit-keyframes changeThree {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs03_b.png ") no-repeat;
background: url("../images/hot_project/tabs03_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs03_a.png ") no-repeat;
background: url("../images/hot_project/tabs03_a.png ") no-repeat;
}
}
.hot-project-tabs ul li:nth-child(3):hover dt {
......@@ -1091,14 +1091,14 @@ dd {
}
@-webkit-keyframes changeFour {
0% {
background: url("../imgs/hot_project/tabs02_b.png ") no-repeat;
background: url("../images/hot_project/tabs02_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs02_a.png ") no-repeat;
background: url("../images/hot_project/tabs02_a.png ") no-repeat;
}
}
.hot-project-tabs ul li:nth-child(4):hover dt {
......@@ -1168,7 +1168,7 @@ body {
.about-us-banner {
width: 100%;
height: 667px;
background: url("../imgs/index/banner.jpg") no-repeat center center;
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
......@@ -1197,7 +1197,7 @@ body {
.about-us-banner {
width: 100%;
height: 450px;
background: url("../imgs/index/banner.jpg") no-repeat center center;
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
......@@ -1225,7 +1225,7 @@ body {
.about-us-banner-bottom {
width: 100%;
height: 824px;
background: url("../imgs/about_us/bg_2.jpg") no-repeat center center;
background: url("../images/about_us/bg_2.jpg") no-repeat center center;
background-size: cover;
}
.about-us-banner-bottom h4 {
......@@ -1319,7 +1319,7 @@ body {
position: relative;
}
.company-introduction div a:nth-child(1) {
background: url("../imgs/about_us/zhongjiang.jpg") no-repeat;
background: url("../images/about_us/zhongjiang.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
.company-introduction div a:nth-child(1)::before {
......@@ -1343,7 +1343,7 @@ body {
background: #f6f6f6;
}
.company-introduction div a:nth-child(2) {
background: url("../imgs/about_us/zhongrong.jpg") no-repeat;
background: url("../images/about_us/zhongrong.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
.company-introduction div a:nth-child(2)::after {
......@@ -1357,7 +1357,7 @@ body {
background: #f6f6f6;
}
.company-introduction div a:nth-child(3) {
background: url("../imgs/about_us/guomin.jpg") no-repeat;
background: url("../images/about_us/guomin.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
.company-introduction div a:nth-child(3)::after {
......@@ -1371,7 +1371,7 @@ body {
background: #f6f6f6;
}
.company-introduction div a:nth-child(4) {
background: url("../imgs/about_us/guangda.jpg") no-repeat;
background: url("../images/about_us/guangda.jpg") no-repeat;
margin-right: 0;
border-right: none;
border-bottom: 1px solid #c3c3c3;
......@@ -1387,23 +1387,23 @@ body {
background: #f6f6f6;
}
.company-introduction div a:nth-child(5) {
background: url("../imgs/about_us/zhongxing.jpg") no-repeat;
background: url("../images/about_us/zhongxing.jpg") no-repeat;
}
.company-introduction div a:nth-child(6) {
background: url("../imgs/about_us/fangzheng.jpg") no-repeat;
background: url("../images/about_us/fangzheng.jpg") no-repeat;
}
.company-introduction div a:nth-child(7) {
background: url("../imgs/about_us/huaxing.jpg") no-repeat;
background: url("../images/about_us/huaxing.jpg") no-repeat;
}
.company-introduction div a:nth-child(8) {
background: url("../imgs/about_us/zhongtai.jpg") no-repeat;
background: url("../images/about_us/zhongtai.jpg") no-repeat;
margin: 0;
border-right: none;
}
.address-map {
height: 575px;
width: 100%;
background: url("../imgs/about_us/map.jpg") no-repeat center center;
background: url("../images/about_us/map.jpg") no-repeat center center;
background-size: cover;
}
.address-map > div {
......
CSS/styles.less → public/stylesheets/styles.less
View file @ 27a4a8a8
/*公共样式*/
@import 'iconfont';
body {
font-family: Microsoft YaHei, simhei, Tahoma, Arial, sans-serif;
}
ul, ol {
list-style: none;
}
.clear::after {
content: '';
display: block;
clear: both;
}
.clear::before {
content: '';
display: table;
}
a {
text-decoration: none;
color: #000;
}
h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
margin: 0;
padding: 0;
font-weight: normal;
}
.fl {
float: left;
}
.fr {
float: right
}
/*公共样式结束*/
/*header开始*/
#header, #footer {
width: 100%;
}
#header {
position: relative;
> a {
position: absolute;
top: 0;
z-index: 999;
}
ul {
font-size: 16px;
li {
margin-right: 44px;
padding: 10px 0;
a {
color: #383838;
font-weight: bold;
padding: 10px;
}
}
li:hover {
a {
border-bottom: 3px solid #000;
}
}
li:last-child {
margin-right: 0;
}
}
}
@media screen and (min-width: 1300px) {
#header {
height: 100px;
line-height: 100px;
> a {
left: 15.789%;
}
ul {
margin-left: 34.89%;
}
}
}
@media screen and (max-width: 1300px) {
#header {
height: 80px;
line-height: 80px;
> a {
left: 8.789%;
}
ul {
margin-left: 25.89%;
}
}
}
/*header结束*/
/*footer开始*/
#footer {
height: 453px;
text-align: center;
background: #2e2e2e;
.hotline {
font-size: 24px;
color: #fff;
margin-top: 58px;
}
h4 {
font-size: 60px;
font-weight: bold;
color: #fff;
margin-bottom: 50px;
margin-top: 30px;
}
hr {
position: relative;
width: 940px;
border: none;
border-bottom: 1px solid #8c8c8c;
margin: 0 auto;
}
hr::after {
content: '';
display: block;
position: absolute;
top: -1px;
left: 443px;
background: #8c8c8c;
width: 73px;
height: 3px;
}
.address {
margin-top: 60px;
color: #00a4d8;
font-size: 14px;
line-height: 26px;
a {
color: #00a4d8;
}
}
.copyright {
color: #aeaeae;
font-size: 14px;
line-height: 26px;
span {
color: #fff;
}
}
}
/*footer结束*/
/*首页*/
.icon-lists .icon {
font-size: 33px;
color: #fff;
width: 27px;
}
#section {
width: 100%;
}
.banner, .option, .project-list {
width: 100%;
}
.banner {
background: url("../imgs/index/banner.jpg") no-repeat center center;
background-size: cover;
.banner-box {
margin: 0 auto;
color: #fff;
h4 {
width: 100%;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
}
}
@media screen and (max-width: 1300px) {
.banner {
height: 375px;
padding-top: 123px;
.banner-box {
width: 914px;
h4 {
font-size: 64px;
}
p {
font-size: 20px;
line-height: 35px;
width: 100%;
}
}
}
}
@media screen and (min-width: 1300px) {
.banner {
height: 524px;
padding-top: 227px;
.banner-box {
width: 1100px;
h4 {
font-size: 82px;
}
p {
line-height: 48px;
font-size: 24px;
width: 100%;
}
}
}
}
.download {
text-align: center;
width: 1207px;
height: 670px;
margin: 0 auto;
.download-top {
position: relative;
width: 100%;
height: 366px;
ul {
position: absolute;
top: 129px;
left: 193px;
margin: 0;
padding: 0;
li {
width: 261px;
height: 68px;
border-radius: 4px; //IE6/7没有border-radius效果
font-size: 18px;
position: relative;
cursor: pointer;
i {
position: absolute;
left: 18px;
top: 13px;
}
b {
position: absolute;
left: 66px;
display: inline-block;
width: 1px;
height: 68px;
background: rgba(255, 255, 255, 0.3);
}
span {
position: absolute;
left: 90px;
line-height: 68px;
}
}
.android {
background: #82b21c;
margin-bottom: 20px;
}
.iphone {
background: #0079c2;
}
}
a {
display: inline-block;
width: 124px;
height: 124px;
position: absolute;
top: 133px;
left: 493px;
font-size: 14px;
}
.iphone-img {
position: absolute;
left: 686px;
top: -157px;
z-index: 10;
}
hr {
width: 938px;
color: #8c8c8c;
position: absolute;
top: 362px;
left: 164px;
}
hr::after {
content: '';
display: block;
width: 74px;
height: 3px;
position: absolute;
left: 432px;
top: -2px;
background: #8c8c8c;
}
}
.download_bottom {
width: 100%;
margin-top: 50px;
ul {
margin-left: 10px;
li {
width: 25%;
height: 163px;
text-align: center;
float: left;
.fl-box {
position: relative;
height: 163px;
dl {
width: 100%;
text-align: center;
.title {
font-size: 36px;
margin: 0 0 22px 0;
}
.detail {
font-size: 14px;
}
}
h4 {
font-size: 44px;
color: #111d2b;
margin-top: 50px;
}
p {
font-size: 16px;
color: #888;
}
> div {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
transform: scale(0);
}
> div:nth-child(2) {
animation-name: stretchdelay01;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
> div:nth-child(1) {
animation-name: stretchdelay02;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
}
}
li:nth-child(1) {
.fl-box {
> div:nth-child(2) {
animation-delay: -1s;
}
> div:nth-child(1) {
animation-delay: 1.5s;
}
}
}
li:nth-child(2) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.75s;
}
> div:nth-child(1) {
animation-delay: 1.75s;
}
}
}
li:nth-child(3) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.5s;
}
> div:nth-child(1) {
animation-delay: 2s;
}
}
}
li:nth-child(4) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.25s;
}
> div:nth-child(1) {
animation-delay: 2.25s;
}
}
}
}
}
}
@-webkit-keyframes stretchdelay01 {
0%, 50%, 100% {
-webkit-transform: scale(0);
}
5%, 45% {
-webkit-transform: scale(1);
}
}
@-webkit-keyframes stretchdelay02 {
0%, 55%, 100% {
-webkit-transform: scale(0);
}
5%, 50% {
-webkit-transform: scale(1);
}
}
.projects {
width: 100%;
background: #f6f6f6;
.projects-header {
width: 100%;
height: 296px;
div {
margin: 0;
padding: 0;
width: 25%;
height: 100%;
background: #111d2b url("../imgs/index/icon_01.png") no-repeat 43% 86px;
}
p {
width: 75%;
height: 100%;
background: #2e2e2e url("../imgs/index/icon_02.jpg") no-repeat 58px 170px;
font-size: 48px;
color: #fff;
span {
display: inline-block;
margin: 90px 0 0 44px;
}
}
}
.projects-content {
width: 1200px;
margin: 0 auto;
position: relative;
padding-bottom: 110px;
.project-intro {
list-style: disc;
margin: 44px 0 79px 48px;
width: 400px;
padding: 42px 20px 2px 0;
border-right: 1px solid #7f7f7f;
font-size: 23px;
color: #565656;
line-height: 31px;
li {
margin-bottom: 10px;
}
}
.computer {
position: absolute;
top: -128px;
left: 50%;
}
.project-info {
width: 100%;
margin-bottom: 30px;
.project-img {
width: 750px;
height: 400px;
background: #faf;
}
.project-one {
background: url("../imgs/index/528ad57.jpg") no-repeat center center;
background-size: cover;
}
.project-two {
background: url("../imgs/index/041c0cc.jpg") no-repeat center center;
background-size: cover;
}
.mr50 {
margin-right: 50px;
}
.project-detail {
width: 400px;
height: 400px;
background: #2e2e2e;
text-align: center;
color: #fff;
h4 {
font-size: 44px;
margin-top: 80px;
}
i {
display: inline-block;
width: 300px;
height: 1px;
background: #979797;
margin: 20px 0;
}
ul {
width: 100%;
li {
width: 33%;
font-size: 20px;
p {
font-size: 16px;
b {
font-size: 36px;
}
}
}
}
div {
font-size: 24px;
margin-top: 24px;
margin-bottom: 26px;
a {
color: #fff;
}
}
}
.project-detail-sm {
width: 366px;
height: 366px;
}
.project-three {
background: #fff url("../imgs/index/fcfbb08.jpg") no-repeat center center;
background-size: cover;
}
.project-four {
background: #fff url("../imgs/index/5ce7cf8.jpg") no-repeat center center;
background-size: cover;
}
.project-five {
background: #fff url("../imgs/index/38be78d.jpg") no-repeat center center;
background-size: cover;
}
}
}
}
/*产品详情页面*/
.product-info {
width: 1200px;
margin: 0 auto;
.product-info-title {
margin: 26px 0;
height: 40px;
line-height: 40px;
position: relative;
font-size: 28px;
color: #2d2f33;
padding-left: 20px;
b {
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 9px;
height: 40px;
background: #2d2f33;
}
}
.product-intro {
position: relative;
table {
width: 1020px;
text-align: center;
color: #3f3f3f;
border-spacing: 0;
thead {
td {
width: 33.33%;
font-size: 22px;
line-height: 56px;
}
}
tbody {
td {
font-size: 18px;
line-height: 67px;
border-right: 1px solid #eaeaea;
a {
font-weight: bold;
color: #fff;
padding: 19px 13px;
margin-top: 43px;
background: #ff4a4a;
border-radius: 10px;
}
}
.profit {
color: #ff4a4a;
span {
font-size: 36px;
}
}
.noborder {
border-right: none;
}
}
tfoot {
td {
line-height: 106px;
text-align: left;
padding-left: 100px;
font-size: 18px;
p {
display: inline-block;
width: 365px;
height: 13px;
border: 1px solid #ff4a4a;
margin-left: 42px;
position: relative;
i {
position: absolute;
left: 0;
top: 0;
display: inline-block;
opacity: 0;
height: 13px;
background: #ff4a4a;
}
}
}
}
}
> div {
width: 180px;
height: 180px;
border-radius: 50%;
border: 10px solid #ececec;
position: absolute;
right: 0px;
top: 95px;
p {
width: 100%;
height: 100%;
text-align: center;
line-height: 180px;
font-size: 40px;
color: #000;
}
> div {
position: absolute;
top: -10px;
left: -10px;
width: 180px;
height: 180px;
border-radius: 50%;
border: 10px solid #ff4a4a;
border-bottom-color: transparent;
border-top-color: transparent;
border-left-color: transparent;
animation: huxian 1s infinite linear;
}
}
}
@-webkit-keyframes huxian {
0% {
transform: rotate(0deg)
}
100% {
transform: rotate(360deg)
}
}
.product-intro {
width: 100%;
height: 408px;
border-bottom: 1px solid #aaa;
}
.product-appointment {
width: 100%;
height: 242px;
border-bottom: 1px solid #aaa;
p:nth-child(2) {
font-size: 18px;
color: #2d2f33;
margin: 34px 0 24px;
padding-left: 20px;
}
form {
padding-left: 20px;
input {
outline: none;
font-size: 14px;
color: #939393;
height: 48px;
width: 246px;
border: 1px solid #939393;
padding-left: 14px;
border-radius: 10px;
margin-right: 45px;
}
#submit {
border: none;
line-height: 48px;
width: 86px;
text-align: center;
color: #fff;
background: #ff4a4a;
font-size: 18px;
padding: 0;
}
#submit:hover {
background: #ec3737;
}
}
#errorName {
width: 246px;
height: 40px;
line-height: 40px;
color: #ff4a4a;
padding-left: 14px;
font-size: 17px;
margin-left: 20px;
}
#errorTel {
width: 246px;
height: 40px;
line-height: 40px;
color: #ff4a4a;
padding-left: 14px;
font-size: 17px;
margin-left: 45px;
}
}
.product-detail {
width: 100%;
height: 1759px;
table {
font-size: 14px;
color: #000;
border-spacing: 0;
line-height: 24px;
.product-detail-key {
width: 140px;
}
.product-detail-value {
width: 939px;
}
td {
padding: 26px 60px;
vertical-align: top;
}
.bb {
border-bottom: 1px solid #939393;
}
.br {
border-right: 1px solid #939393;
}
}
}
}
/*热点项目*/
@media screen and (min-width: 1300px) {
.hot-project-banner {
height: 600px;
width: 100%;
background: url('../imgs/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
h4 {
font-size: 48px;
font-weight: bold;
margin-top: 240px;
margin-bottom: 60px;
}
p {
font-size: 32px;
line-height: 42px;
}
}
}
@media screen and (max-width: 1300px) {
.hot-project-banner {
height: 470px;
width: 100%;
background: url('../imgs/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
h4 {
font-size: 54px;
font-weight: bold;
margin-top: 120px;
margin-bottom: 40px;
}
p {
font-size: 24px;
line-height: 36px;
}
}
}
.hot-project-introducer {
height: 728px;
width: 1200px;
margin: 0 auto;
> ul {
width: 100%;
height: 180px;
li {
width: 25%;
font-size: 18px;
color: #000;
line-height: 180px;
text-align: center;
font-weight: bold;
i {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: #bb342e;
position: relative;
top: -3px;
margin-right: 40px;
}
b {
display: inline-block;
width: 46px;
height: 46px;
position: relative;
top: 20px;
margin-right: 6px;
background: url("../imgs/hot_project/tabs01.png") no-repeat -46px -13px;
}
}
li:nth-child(2) {
> b {
background-position: -176px -13px;
}
}
li:nth-child(3) {
> b {
background-position: -329px -13px;
}
}
li:nth-child(4) {
> b {
background-position: -450px -13pxpx;
}
}
}
> hr {
width: 940px;
margin: 0 auto;
background: #959595;
position: relative;
}
hr::after {
content: '';
display: block;
width: 73px;
height: 3px;
background: #01a9dd;
position: absolute;
left: 433px;
top: -2px;
}
.introducer {
width: 700px;
margin: 0 auto;
position: relative;
h4 {
font-size: 36px;
font-weight: bold;
text-align: center;
margin: 50px 0 58px;
}
div {
width: 100%;
color: #000;
margin: 15px 0;
span {
font-size: 25px;
}
input {
width: 506px;
height: 40px;
line-height: 40px;
font-size: 18px;
color: #7f7f7f;
outline: none;
border: 1px solid #090204;
padding: 0 30px;
background: #f4f4f4;
}
textarea {
width: 506px;
min-height: 100px;
padding: 12px 30px;
font-size: 18px;
color: #7f7f7f;
border: 1px solid #090204;
background: #f4f4f4;
outline: none;
}
}
div:nth-child(4) {
span {
position: relative;
left: 0;
top: -74px;
}
}
div:last-child {
text-align: center;
margin-top: 55px;
input {
width: 333px;
height: 60px;
line-height: 60px;
border: none;
font-size: 24px;
color: #fff;
background: #868686;
border-radius: 10px;
text-align: center;
}
}
p {
height: 40px;
line-height: 40px;
font-size: 18px;
color: #ff4a4b;
position: absolute;
}
p:nth-child(3) {
top: 102px;
right: -238px;
}
p:nth-child(5) {
top: 172px;
right: -152px;
}
}
}
.hot-project-address {
width: 100%;
height: 926px;
background: #1272ac;
.hot-project-address-box {
width: 1200px;
height: 100%;
margin: 0 auto;
position: relative;
> div:nth-child(1) {
position: absolute;
color: #fff;
top: 40px;
left: 20px;
h4 {
font-size: 32px;
font-weight: bold;
line-height: 42px;
}
p {
font-size: 18px;
line-height: 53px;
}
}
> div:nth-child(2) {
width: 100%;
height: 100%;
}
}
}
.hot-project-tabs {
width: 100%;
height: 690px;
background: #f6f6f6;
ul {
width: 1203px;
height: 350px;
margin:180px auto 160px;
border: 1px solid #43abb6;
li {
width: 300px;
height: 100%;
font-size: 16px;
color: #000;
text-align: center;
dl {
width: 100%;
dt {
width: 115px;
height: 115px;
margin: 44px auto 0;
}
dd {
line-height: 28px;
h4 {
font-size: 28px;
color: #43abb6;
margin: 14px 0 24px;
}
}
}
}
li:nth-child(1) {
border-right: 1px solid #43abb6;
dt {
background: url("../imgs/hot_project/tabs05_b.png") no-repeat;
}
}
li:nth-child(2) {
border-right: 1px solid #43abb6;
dt {
background: url("../imgs/hot_project/tabs04_b.png") no-repeat;
}
}
li:nth-child(3) {
border-right: 1px solid #43abb6;
dt {
background: url("../imgs/hot_project/tabs03_b.png") no-repeat;
}
}
li:nth-child(4) {
dt {
background: url("../imgs/hot_project/tabs02_b.png") no-repeat;
}
}
li:hover {
color: #fff;
background: #43abb6;
h4 {
color: #fff;
}
}
li:nth-child(1):hover {
@-webkit-keyframes changeOne {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs05_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs05_a.png ") no-repeat;
opacity: 1;
}
}
dt {
animation-name: changeOne;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(2):hover {
@-webkit-keyframes changeTwo {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs04_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../imgs/hot_project/tabs04_a.png ") no-repeat -1px -1px;
opacity: 1;
}
}
dt {
animation-name: changeTwo;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(3):hover {
@-webkit-keyframes changeThree {
0% {
opacity: 1;
background: url("../imgs/hot_project/tabs03_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs03_a.png ") no-repeat;
}
}
dt {
animation-name: changeThree;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(4):hover {
@-webkit-keyframes changeFour {
0% {
background: url("../imgs/hot_project/tabs02_b.png ") no-repeat;
}
50% {
opacity:0;
}
100% {
opacity: 1;
background: url("../imgs/hot_project/tabs02_a.png ") no-repeat;
}
}
dt {
animation-name: changeFour;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
}
}
body {
position: relative;
}
.modal-box {
display: none;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.3);
z-index: 999;
position: fixed;
.modal-dialog {
position: fixed;
left: 50%;
top: 50%;
margin-top: -300px;
margin-left: -450px;
width: 830px;
height: 600px;
background: #fff;
padding-left: 70px;
h4 {
margin-top: 69px;
font-size: 35px;
color: #000;
}
h3 {
font-size: 45px;
font-weight: bold;
color: #ff4a4a;
margin: 43px 0;
}
h6 {
font-size: 18px;
font-weight: bold;
margin-bottom: 20px;
}
p {
font-size: 18px;
width: 331px;
line-height: 28px;
}
img {
position: absolute;
right: 55px;
top: 108px;
}
b {
font-size: 42px;
position: absolute;
right: 27px;
top: 9px;
cursor: pointer;
}
}
}
/*关于我们页面*/
@media screen and (min-width: 1300px) {
.about-us-banner {
width: 100%;
height: 667px;
background: url("../imgs/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
.banner-box {
width: 1100px;
margin: 200px auto 0;
color: #fff;
h4 {
width: 100%;
font-size: 82px;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
p {
width: 100%;
line-height: 48px;
font-size: 24px;
text-align: left;
}
}
}
}
@media screen and (max-width: 1300px) {
.about-us-banner {
width: 100%;
height: 450px;
background: url("../imgs/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
.banner-box {
width: 914px;
margin: 140px auto 0;
color: #fff;
h4 {
width: 100%;
font-size: 64px;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
p {
width: 100%;
line-height: 35px;
font-size: 20px;
text-align: left;
}
}
}
}
.about-us-banner-bottom {
width: 100%;
height: 824px;
background: url("../imgs/about_us/bg_2.jpg") no-repeat center center;
background-size: cover;
h4 {
font-size: 52px;
color: #fff;
margin: 28px auto 16px;
text-align: center;
}
hr {
display: block;
width: 73px;
border: 3px solid #0074c3;
border-bottom: transparent;
border-left: transparent;
border-right: transparent;
margin: 0 auto;
}
p {
font-size: 22px;
width: 992px;
margin: 572px auto 0;
line-height: 42px;
}
}
.company-introduction {
height: 1300px;
width: 100%;
background: #f6f6f6;
h2 {
width: 1200px;
height: 74px;
line-height: 74px;
font-size: 46px;
position: relative;
padding-left: 20px;
margin: 40px auto;
b {
display: inline-block;
height: 74px;
width: 3px;
background: #0074c3;
position: absolute;
left: 0;
top: 0;
}
}
ul {
width: 1200px;
margin: 0 auto;
li {
text-align: center;
width: 300px;
padding: 0 50px 60px;
h4 {
font-size: 54px;
color: #000;
line-height: 75px;
}
h6 {
font-size: 18px;
color: #666666;
margin: 10px 0 20px;
}
p {
line-height: 27px;
font-size: 15px;
color: #000;
text-align: left;
}
}
li:nth-child(1) {
width: 299px;
border-right: 1px solid #c3c3c3;
}
li:nth-child(2) {
width: 299px;
border-right: 1px solid #c3c3c3;
}
}
div {
width: 1200px;
margin: 0 auto;
a {
display: inline-block;
width: 280px;
height: 270px;
text-align: center;
margin-right: 17px;
border-right: 1px solid #c3c3c3;
position: relative;
}
a:nth-child(1) {
background: url("../imgs/about_us/zhongjiang.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(1)::before {
content: '';
display: inline-block;
width: 17px;
height: 20px;
position: absolute;
left:0;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(1)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(2) {
background: url("../imgs/about_us/zhongrong.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(2)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(3) {
background: url("../imgs/about_us/guomin.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(3)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(4) {
background: url("../imgs/about_us/guangda.jpg") no-repeat;
margin-right: 0;
border-right: none;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(4)::after {
content: '';
display: inline-block;
width: 17px;
height: 20px;
position: absolute;
right:0px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(5) {
background: url("../imgs/about_us/zhongxing.jpg") no-repeat;
}
a:nth-child(6) {
background: url("../imgs/about_us/fangzheng.jpg") no-repeat;
}
a:nth-child(7) {
background: url("../imgs/about_us/huaxing.jpg") no-repeat;
}
a:nth-child(8) {
background: url("../imgs/about_us/zhongtai.jpg") no-repeat;
margin: 0;
border-right: none;
}
}
}
.address-map {
height: 575px;
width: 100%;
background: url("../imgs/about_us/map.jpg") no-repeat center center;
background-size: cover;
> div {
width: 1200px;
height: 100%;
margin: 0 auto;
> div {
margin: 150px 0 0 240px;
width: 291px;
height: 207px;
padding: 32px 18px 0;
background: #fff;
position: relative;
span {
display: inline-block;
width: 66px;
height: 66px;
border-radius: 50%;
background: #121e2c;
position: absolute;
left: 9px;
top: 18px;
text-align: center;
img {
margin-top: 18px;
}
}
h4 {
font-size: 36px;
color: #444444;
line-height: 46px;
margin-left: 64px;
}
hr {
display: block;
width: 149px;
border: none;
border-bottom: 1px solid #a9a9a9;
margin: 5px auto 20px;
}
p {
font-size: 18px;
color: #828282;
line-height: 24px;
}
h3 {
font-size: 25px;
color: #fb2274;
margin-top: 20px;
}
}
}
}
/*公共样式*/
@import 'iconfont';
body {
font-family: Microsoft YaHei, simhei, Tahoma, Arial, sans-serif;
}
ul, ol {
list-style: none;
}
.clear::after {
content: '';
display: block;
clear: both;
}
.clear::before {
content: '';
display: table;
}
a {
text-decoration: none;
color: #000;
}
h1, h2, h3, h4, h5, h6, ul, li, b, p, dl, dt, dd {
margin: 0;
padding: 0;
font-weight: normal;
}
.fl {
float: left;
}
.fr {
float: right
}
/*公共样式结束*/
/*header开始*/
#header, #footer {
width: 100%;
}
#header {
position: relative;
> a {
position: absolute;
top: 0;
z-index: 999;
}
ul {
font-size: 16px;
li {
margin-right: 44px;
padding: 10px 0;
a {
color: #383838;
font-weight: bold;
padding: 10px;
}
}
li:hover {
a {
border-bottom: 3px solid #000;
}
}
li:last-child {
margin-right: 0;
}
}
}
@media screen and (min-width: 1300px) {
#header {
height: 100px;
line-height: 100px;
> a {
left: 15.789%;
}
ul {
margin-left: 34.89%;
}
}
}
@media screen and (max-width: 1300px) {
#header {
height: 80px;
line-height: 80px;
> a {
left: 8.789%;
}
ul {
margin-left: 25.89%;
}
}
}
/*header结束*/
/*footer开始*/
#footer {
height: 453px;
text-align: center;
background: #2e2e2e;
.hotline {
font-size: 24px;
color: #fff;
margin-top: 58px;
}
h4 {
font-size: 60px;
font-weight: bold;
color: #fff;
margin-bottom: 50px;
margin-top: 30px;
}
hr {
position: relative;
width: 940px;
border: none;
border-bottom: 1px solid #8c8c8c;
margin: 0 auto;
}
hr::after {
content: '';
display: block;
position: absolute;
top: -1px;
left: 443px;
background: #8c8c8c;
width: 73px;
height: 3px;
}
.address {
margin-top: 60px;
color: #00a4d8;
font-size: 14px;
line-height: 26px;
a {
color: #00a4d8;
}
}
.copyright {
color: #aeaeae;
font-size: 14px;
line-height: 26px;
span {
color: #fff;
}
}
}
/*footer结束*/
/*首页*/
.icon-lists .icon {
font-size: 33px;
color: #fff;
width: 27px;
}
#section {
width: 100%;
}
.banner, .option, .project-list {
width: 100%;
}
.banner {
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
.banner-box {
margin: 0 auto;
color: #fff;
h4 {
width: 100%;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
}
}
@media screen and (max-width: 1300px) {
.banner {
height: 375px;
padding-top: 123px;
.banner-box {
width: 914px;
h4 {
font-size: 64px;
}
p {
font-size: 20px;
line-height: 35px;
width: 100%;
}
}
}
}
@media screen and (min-width: 1300px) {
.banner {
height: 524px;
padding-top: 227px;
.banner-box {
width: 1100px;
h4 {
font-size: 82px;
}
p {
line-height: 48px;
font-size: 24px;
width: 100%;
}
}
}
}
.download {
text-align: center;
width: 1207px;
height: 670px;
margin: 0 auto;
.download-top {
position: relative;
width: 100%;
height: 366px;
ul {
position: absolute;
top: 129px;
left: 193px;
margin: 0;
padding: 0;
li {
width: 261px;
height: 68px;
border-radius: 4px; //IE6/7没有border-radius效果
font-size: 18px;
position: relative;
cursor: pointer;
i {
position: absolute;
left: 18px;
top: 13px;
}
b {
position: absolute;
left: 66px;
display: inline-block;
width: 1px;
height: 68px;
background: rgba(255, 255, 255, 0.3);
}
span {
position: absolute;
left: 90px;
line-height: 68px;
}
}
.android {
background: #82b21c;
margin-bottom: 20px;
}
.iphone {
background: #0079c2;
}
}
a {
display: inline-block;
width: 124px;
height: 124px;
position: absolute;
top: 133px;
left: 493px;
font-size: 14px;
}
.iphone-img {
position: absolute;
left: 686px;
top: -157px;
z-index: 10;
}
hr {
width: 938px;
color: #8c8c8c;
position: absolute;
top: 362px;
left: 164px;
}
hr::after {
content: '';
display: block;
width: 74px;
height: 3px;
position: absolute;
left: 432px;
top: -2px;
background: #8c8c8c;
}
}
.download_bottom {
width: 100%;
margin-top: 50px;
ul {
margin-left: 10px;
li {
width: 25%;
height: 163px;
text-align: center;
float: left;
.fl-box {
position: relative;
height: 163px;
dl {
width: 100%;
text-align: center;
.title {
font-size: 36px;
margin: 0 0 22px 0;
}
.detail {
font-size: 14px;
}
}
h4 {
font-size: 44px;
color: #111d2b;
margin-top: 50px;
}
p {
font-size: 16px;
color: #888;
}
> div {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
transform: scale(0);
}
> div:nth-child(2) {
animation-name: stretchdelay01;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
> div:nth-child(1) {
animation-name: stretchdelay02;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
}
}
li:nth-child(1) {
.fl-box {
> div:nth-child(2) {
animation-delay: -1s;
}
> div:nth-child(1) {
animation-delay: 1.5s;
}
}
}
li:nth-child(2) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.75s;
}
> div:nth-child(1) {
animation-delay: 1.75s;
}
}
}
li:nth-child(3) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.5s;
}
> div:nth-child(1) {
animation-delay: 2s;
}
}
}
li:nth-child(4) {
.fl-box {
> div:nth-child(2) {
animation-delay: -0.25s;
}
> div:nth-child(1) {
animation-delay: 2.25s;
}
}
}
}
}
}
@-webkit-keyframes stretchdelay01 {
0%, 50%, 100% {
-webkit-transform: scale(0);
}
5%, 45% {
-webkit-transform: scale(1);
}
}
@-webkit-keyframes stretchdelay02 {
0%, 55%, 100% {
-webkit-transform: scale(0);
}
5%, 50% {
-webkit-transform: scale(1);
}
}
.projects {
width: 100%;
background: #f6f6f6;
.projects-header {
width: 100%;
height: 296px;
div {
margin: 0;
padding: 0;
width: 25%;
height: 100%;
background: #111d2b url("../images/index/icon_01.png") no-repeat 43% 86px;
}
p {
width: 75%;
height: 100%;
background: #2e2e2e url("../images/index/icon_02.jpg") no-repeat 58px 170px;
font-size: 48px;
color: #fff;
span {
display: inline-block;
margin: 90px 0 0 44px;
}
}
}
.projects-content {
width: 1200px;
margin: 0 auto;
position: relative;
padding-bottom: 110px;
.project-intro {
list-style: disc;
margin: 44px 0 79px 48px;
width: 400px;
padding: 42px 20px 2px 0;
border-right: 1px solid #7f7f7f;
font-size: 23px;
color: #565656;
line-height: 31px;
li {
margin-bottom: 10px;
}
}
.computer {
position: absolute;
top: -128px;
left: 50%;
}
.project-info {
width: 100%;
margin-bottom: 30px;
.project-img {
width: 750px;
height: 400px;
background: #faf;
}
.project-one {
background: url("../images/index/528ad57.jpg") no-repeat center center;
background-size: cover;
}
.project-two {
background: url("../images/index/041c0cc.jpg") no-repeat center center;
background-size: cover;
}
.mr50 {
margin-right: 50px;
}
.project-detail {
width: 400px;
height: 400px;
background: #2e2e2e;
text-align: center;
color: #fff;
h4 {
font-size: 44px;
margin-top: 80px;
}
i {
display: inline-block;
width: 300px;
height: 1px;
background: #979797;
margin: 20px 0;
}
ul {
width: 100%;
li {
width: 33%;
font-size: 20px;
p {
font-size: 16px;
b {
font-size: 36px;
}
}
}
}
div {
font-size: 24px;
margin-top: 24px;
margin-bottom: 26px;
a {
color: #fff;
}
}
}
.project-detail-sm {
width: 366px;
height: 366px;
}
.project-three {
background: #fff url("../images/index/fcfbb08.jpg") no-repeat center center;
background-size: cover;
}
.project-four {
background: #fff url("../images/index/5ce7cf8.jpg") no-repeat center center;
background-size: cover;
}
.project-five {
background: #fff url("../images/index/38be78d.jpg") no-repeat center center;
background-size: cover;
}
}
}
}
/*产品详情页面*/
.product-info {
width: 1200px;
margin: 0 auto;
.product-info-title {
margin: 26px 0;
height: 40px;
line-height: 40px;
position: relative;
font-size: 28px;
color: #2d2f33;
padding-left: 20px;
b {
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 9px;
height: 40px;
background: #2d2f33;
}
}
.product-intro {
position: relative;
table {
width: 1020px;
text-align: center;
color: #3f3f3f;
border-spacing: 0;
thead {
td {
width: 33.33%;
font-size: 22px;
line-height: 56px;
}
}
tbody {
td {
font-size: 18px;
line-height: 67px;
border-right: 1px solid #eaeaea;
a {
font-weight: bold;
color: #fff;
padding: 19px 13px;
margin-top: 43px;
background: #ff4a4a;
border-radius: 10px;
}
}
.profit {
color: #ff4a4a;
span {
font-size: 36px;
}
}
.noborder {
border-right: none;
}
}
tfoot {
td {
line-height: 106px;
text-align: left;
padding-left: 100px;
font-size: 18px;
p {
display: inline-block;
width: 365px;
height: 13px;
border: 1px solid #ff4a4a;
margin-left: 42px;
position: relative;
i {
position: absolute;
left: 0;
top: 0;
display: inline-block;
opacity: 0;
height: 13px;
background: #ff4a4a;
}
}
}
}
}
> div {
width: 180px;
height: 180px;
border-radius: 50%;
border: 10px solid #ececec;
position: absolute;
right: 0px;
top: 95px;
p {
width: 100%;
height: 100%;
text-align: center;
line-height: 180px;
font-size: 40px;
color: #000;
}
> div {
position: absolute;
top: -10px;
left: -10px;
width: 180px;
height: 180px;
border-radius: 50%;
border: 10px solid #ff4a4a;
border-bottom-color: transparent;
border-top-color: transparent;
border-left-color: transparent;
animation: huxian 1s infinite linear;
}
}
}
@-webkit-keyframes huxian {
0% {
transform: rotate(0deg)
}
100% {
transform: rotate(360deg)
}
}
.product-intro {
width: 100%;
height: 408px;
border-bottom: 1px solid #aaa;
}
.product-appointment {
width: 100%;
height: 242px;
border-bottom: 1px solid #aaa;
p:nth-child(2) {
font-size: 18px;
color: #2d2f33;
margin: 34px 0 24px;
padding-left: 20px;
}
form {
padding-left: 20px;
input {
outline: none;
font-size: 14px;
color: #939393;
height: 48px;
width: 246px;
border: 1px solid #939393;
padding-left: 14px;
border-radius: 10px;
margin-right: 45px;
}
#submit {
border: none;
line-height: 48px;
width: 86px;
text-align: center;
color: #fff;
background: #ff4a4a;
font-size: 18px;
padding: 0;
}
#submit:hover {
background: #ec3737;
}
}
#errorName {
width: 246px;
height: 40px;
line-height: 40px;
color: #ff4a4a;
padding-left: 14px;
font-size: 17px;
margin-left: 20px;
}
#errorTel {
width: 246px;
height: 40px;
line-height: 40px;
color: #ff4a4a;
padding-left: 14px;
font-size: 17px;
margin-left: 45px;
}
}
.product-detail {
width: 100%;
height: 1759px;
table {
font-size: 14px;
color: #000;
border-spacing: 0;
line-height: 24px;
.product-detail-key {
width: 140px;
}
.product-detail-value {
width: 939px;
}
td {
padding: 26px 60px;
vertical-align: top;
}
.bb {
border-bottom: 1px solid #939393;
}
.br {
border-right: 1px solid #939393;
}
}
}
}
/*热点项目*/
@media screen and (min-width: 1300px) {
.hot-project-banner {
height: 600px;
width: 100%;
background: url('../images/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
h4 {
font-size: 48px;
font-weight: bold;
margin-top: 240px;
margin-bottom: 60px;
}
p {
font-size: 32px;
line-height: 42px;
}
}
}
@media screen and (max-width: 1300px) {
.hot-project-banner {
height: 470px;
width: 100%;
background: url('../images/hot_project/hot_project_banner.jpg') no-repeat center center;
background-size: cover;
text-align: center;
color: #fff;
h4 {
font-size: 54px;
font-weight: bold;
margin-top: 120px;
margin-bottom: 40px;
}
p {
font-size: 24px;
line-height: 36px;
}
}
}
.hot-project-introducer {
height: 728px;
width: 1200px;
margin: 0 auto;
> ul {
width: 100%;
height: 180px;
li {
width: 25%;
font-size: 18px;
color: #000;
line-height: 180px;
text-align: center;
font-weight: bold;
i {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: #bb342e;
position: relative;
top: -3px;
margin-right: 40px;
}
b {
display: inline-block;
width: 46px;
height: 46px;
position: relative;
top: 20px;
margin-right: 6px;
background: url("../images/hot_project/tabs01.png") no-repeat -46px -13px;
}
}
li:nth-child(2) {
> b {
background-position: -176px -13px;
}
}
li:nth-child(3) {
> b {
background-position: -329px -13px;
}
}
li:nth-child(4) {
> b {
background-position: -450px -13pxpx;
}
}
}
> hr {
width: 940px;
margin: 0 auto;
background: #959595;
position: relative;
}
hr::after {
content: '';
display: block;
width: 73px;
height: 3px;
background: #01a9dd;
position: absolute;
left: 433px;
top: -2px;
}
.introducer {
width: 700px;
margin: 0 auto;
position: relative;
h4 {
font-size: 36px;
font-weight: bold;
text-align: center;
margin: 50px 0 58px;
}
div {
width: 100%;
color: #000;
margin: 15px 0;
span {
font-size: 25px;
}
input {
width: 506px;
height: 40px;
line-height: 40px;
font-size: 18px;
color: #7f7f7f;
outline: none;
border: 1px solid #090204;
padding: 0 30px;
background: #f4f4f4;
}
textarea {
width: 506px;
min-height: 100px;
padding: 12px 30px;
font-size: 18px;
color: #7f7f7f;
border: 1px solid #090204;
background: #f4f4f4;
outline: none;
}
}
div:nth-child(4) {
span {
position: relative;
left: 0;
top: -74px;
}
}
div:last-child {
text-align: center;
margin-top: 55px;
input {
width: 333px;
height: 60px;
line-height: 60px;
border: none;
font-size: 24px;
color: #fff;
background: #868686;
border-radius: 10px;
text-align: center;
}
}
p {
height: 40px;
line-height: 40px;
font-size: 18px;
color: #ff4a4b;
position: absolute;
}
p:nth-child(3) {
top: 102px;
right: -238px;
}
p:nth-child(5) {
top: 172px;
right: -152px;
}
}
}
.hot-project-address {
width: 100%;
height: 926px;
background: #1272ac;
.hot-project-address-box {
width: 1200px;
height: 100%;
margin: 0 auto;
position: relative;
> div:nth-child(1) {
position: absolute;
color: #fff;
top: 40px;
left: 20px;
h4 {
font-size: 32px;
font-weight: bold;
line-height: 42px;
}
p {
font-size: 18px;
line-height: 53px;
}
}
> div:nth-child(2) {
width: 100%;
height: 100%;
}
}
}
.hot-project-tabs {
width: 100%;
height: 690px;
background: #f6f6f6;
ul {
width: 1203px;
height: 350px;
margin:180px auto 160px;
border: 1px solid #43abb6;
li {
width: 300px;
height: 100%;
font-size: 16px;
color: #000;
text-align: center;
dl {
width: 100%;
dt {
width: 115px;
height: 115px;
margin: 44px auto 0;
}
dd {
line-height: 28px;
h4 {
font-size: 28px;
color: #43abb6;
margin: 14px 0 24px;
}
}
}
}
li:nth-child(1) {
border-right: 1px solid #43abb6;
dt {
background: url("../images/hot_project/tabs05_b.png") no-repeat;
}
}
li:nth-child(2) {
border-right: 1px solid #43abb6;
dt {
background: url("../images/hot_project/tabs04_b.png") no-repeat;
}
}
li:nth-child(3) {
border-right: 1px solid #43abb6;
dt {
background: url("../images/hot_project/tabs03_b.png") no-repeat;
}
}
li:nth-child(4) {
dt {
background: url("../images/hot_project/tabs02_b.png") no-repeat;
}
}
li:hover {
color: #fff;
background: #43abb6;
h4 {
color: #fff;
}
}
li:nth-child(1):hover {
@-webkit-keyframes changeOne {
0% {
opacity: 1;
background: url("../images/hot_project/tabs05_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../images/hot_project/tabs05_a.png ") no-repeat;
opacity: 1;
}
}
dt {
animation-name: changeOne;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(2):hover {
@-webkit-keyframes changeTwo {
0% {
opacity: 1;
background: url("../images/hot_project/tabs04_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
background: url("../images/hot_project/tabs04_a.png ") no-repeat -1px -1px;
opacity: 1;
}
}
dt {
animation-name: changeTwo;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(3):hover {
@-webkit-keyframes changeThree {
0% {
opacity: 1;
background: url("../images/hot_project/tabs03_b.png ") no-repeat;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
background: url("../images/hot_project/tabs03_a.png ") no-repeat;
}
}
dt {
animation-name: changeThree;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
li:nth-child(4):hover {
@-webkit-keyframes changeFour {
0% {
background: url("../images/hot_project/tabs02_b.png ") no-repeat;
}
50% {
opacity:0;
}
100% {
opacity: 1;
background: url("../images/hot_project/tabs02_a.png ") no-repeat;
}
}
dt {
animation-name: changeFour;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
}
}
}
body {
position: relative;
}
.modal-box {
display: none;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.3);
z-index: 999;
position: fixed;
.modal-dialog {
position: fixed;
left: 50%;
top: 50%;
margin-top: -300px;
margin-left: -450px;
width: 830px;
height: 600px;
background: #fff;
padding-left: 70px;
h4 {
margin-top: 69px;
font-size: 35px;
color: #000;
}
h3 {
font-size: 45px;
font-weight: bold;
color: #ff4a4a;
margin: 43px 0;
}
h6 {
font-size: 18px;
font-weight: bold;
margin-bottom: 20px;
}
p {
font-size: 18px;
width: 331px;
line-height: 28px;
}
img {
position: absolute;
right: 55px;
top: 108px;
}
b {
font-size: 42px;
position: absolute;
right: 27px;
top: 9px;
cursor: pointer;
}
}
}
/*关于我们页面*/
@media screen and (min-width: 1300px) {
.about-us-banner {
width: 100%;
height: 667px;
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
.banner-box {
width: 1100px;
margin: 200px auto 0;
color: #fff;
h4 {
width: 100%;
font-size: 82px;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
p {
width: 100%;
line-height: 48px;
font-size: 24px;
text-align: left;
}
}
}
}
@media screen and (max-width: 1300px) {
.about-us-banner {
width: 100%;
height: 450px;
background: url("../images/index/banner.jpg") no-repeat center center;
background-size: cover;
color: #fff;
text-align: center;
.banner-box {
width: 914px;
margin: 140px auto 0;
color: #fff;
h4 {
width: 100%;
font-size: 64px;
margin-top: 0;
margin-bottom: 35px;
text-align: center;
font-weight: normal;
}
p {
width: 100%;
line-height: 35px;
font-size: 20px;
text-align: left;
}
}
}
}
.about-us-banner-bottom {
width: 100%;
height: 824px;
background: url("../images/about_us/bg_2.jpg") no-repeat center center;
background-size: cover;
h4 {
font-size: 52px;
color: #fff;
margin: 28px auto 16px;
text-align: center;
}
hr {
display: block;
width: 73px;
border: 3px solid #0074c3;
border-bottom: transparent;
border-left: transparent;
border-right: transparent;
margin: 0 auto;
}
p {
font-size: 22px;
width: 992px;
margin: 572px auto 0;
line-height: 42px;
}
}
.company-introduction {
height: 1300px;
width: 100%;
background: #f6f6f6;
h2 {
width: 1200px;
height: 74px;
line-height: 74px;
font-size: 46px;
position: relative;
padding-left: 20px;
margin: 40px auto;
b {
display: inline-block;
height: 74px;
width: 3px;
background: #0074c3;
position: absolute;
left: 0;
top: 0;
}
}
ul {
width: 1200px;
margin: 0 auto;
li {
text-align: center;
width: 300px;
padding: 0 50px 60px;
h4 {
font-size: 54px;
color: #000;
line-height: 75px;
}
h6 {
font-size: 18px;
color: #666666;
margin: 10px 0 20px;
}
p {
line-height: 27px;
font-size: 15px;
color: #000;
text-align: left;
}
}
li:nth-child(1) {
width: 299px;
border-right: 1px solid #c3c3c3;
}
li:nth-child(2) {
width: 299px;
border-right: 1px solid #c3c3c3;
}
}
div {
width: 1200px;
margin: 0 auto;
a {
display: inline-block;
width: 280px;
height: 270px;
text-align: center;
margin-right: 17px;
border-right: 1px solid #c3c3c3;
position: relative;
}
a:nth-child(1) {
background: url("../images/about_us/zhongjiang.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(1)::before {
content: '';
display: inline-block;
width: 17px;
height: 20px;
position: absolute;
left:0;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(1)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(2) {
background: url("../images/about_us/zhongrong.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(2)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(3) {
background: url("../images/about_us/guomin.jpg") no-repeat;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(3)::after {
content: '';
display: inline-block;
width: 34px;
height: 20px;
position: absolute;
right:-17px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(4) {
background: url("../images/about_us/guangda.jpg") no-repeat;
margin-right: 0;
border-right: none;
border-bottom: 1px solid #c3c3c3;
}
a:nth-child(4)::after {
content: '';
display: inline-block;
width: 17px;
height: 20px;
position: absolute;
right:0px;
bottom: -10px;
background: #f6f6f6;
}
a:nth-child(5) {
background: url("../images/about_us/zhongxing.jpg") no-repeat;
}
a:nth-child(6) {
background: url("../images/about_us/fangzheng.jpg") no-repeat;
}
a:nth-child(7) {
background: url("../images/about_us/huaxing.jpg") no-repeat;
}
a:nth-child(8) {
background: url("../images/about_us/zhongtai.jpg") no-repeat;
margin: 0;
border-right: none;
}
}
}
.address-map {
height: 575px;
width: 100%;
background: url("../images/about_us/map.jpg") no-repeat center center;
background-size: cover;
> div {
width: 1200px;
height: 100%;
margin: 0 auto;
> div {
margin: 150px 0 0 240px;
width: 291px;
height: 207px;
padding: 32px 18px 0;
background: #fff;
position: relative;
span {
display: inline-block;
width: 66px;
height: 66px;
border-radius: 50%;
background: #121e2c;
position: absolute;
left: 9px;
top: 18px;
text-align: center;
img {
margin-top: 18px;
}
}
h4 {
font-size: 36px;
color: #444444;
line-height: 46px;
margin-left: 64px;
}
hr {
display: block;
width: 149px;
border: none;
border-bottom: 1px solid #a9a9a9;
margin: 5px auto 20px;
}
p {
font-size: 18px;
color: #828282;
line-height: 24px;
}
h3 {
font-size: 25px;
color: #fb2274;
margin-top: 20px;
}
}
}
}
public/stylesheets/variable.less 0 → 100644
View file @ 27a4a8a8
@container-width: 1000px;
\ No newline at end of file
routes/index.js 0 → 100644
View file @ 27a4a8a8
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', {
page: 'index',
abcd:123,
products:[
{
title:'中电投西安',
img:'/images/index/528ad57.jpg',
raiseTime:'28',
raiseFunds: '4',
maxProfits: '8.5',
link:''
},{
title:'中电投西安',
img:'/images/index/041c0cc.jpg',
raiseTime:'28',
raiseFunds: '4',
maxProfits: '8.5',
link:''
},{
title:'中电投西安',
img:'/images/index/fcfbb08.jpg',
raiseTime:'28',
raiseFunds: '4',
maxProfits: '8.5',
link:''
},{
title:'中电投西安',
img:'/images/index/5ce7cf8.jpg',
raiseTime:'28',
raiseFunds: '4',
maxProfits: '8.5',
link:''
},{
title:'中电投西安',
img:'/images/index/38be78d.jpg',
raiseTime:'28',
raiseFunds: '4',
maxProfits: '8.5',
link:''
},
]
});
});
module.exports = router;
views/error.hbs 0 → 100644
View file @ 27a4a8a8
<h1>页面出错了!</h1>
<h2>{{message}}</h2>
<p>{{error}}</p>
views/index.hbs 0 → 100644
View file @ 27a4a8a8
<div class="banner">
<div class="banner-box">
<h1>海量资源 轻松抢单</h1>
<p>
以科技为手段，面向财富管理行业从业人员的运营服务提供商。
匹配用户风险偏好与投资品，利用互联网大数据，对用户行为、
市场、产品等进行详细的分析，系统为客户推荐多元化的投资组合，
避免客户与理财顾问之间可能的利益冲突，减少用户的投资理财成本支出，使投资人获得更多的收益。
</p>
</div>
</div>
<div class="download">
<a class="android">
<i class="iconfont icon-android"></i>
下载Android版
</a>
<a class="iphone">
<i class="iconfont icon-iphone"></i>
下载iPhone版
</a>
<a class="qr-code" href="">
<img src="/images/index/QR_Code.jpg" alt="">
<span>扫描下载富豆APP</span>
</a>
<img class="app-screen" src="/images/index/iphone.png" alt="app screen">
<hr class="line-separate"/>
</div>
<div class="character">
<ul class="clear">
<li>
<div>
<h3>1000亿</h3>
<h4>累计交易</h4>
</div>
<div>
<img src="/images/index/picture_01.png"/>
<h3>金融脱媒</h3>
<h4>一手资源，从融资方直接取得项目资源</h4>
</div>
</li>
<li>
<div>
<h3>1000亿</h3>
<h4>累计交易</h4>
</div>
<div>
<img src="/images/index/picture_01.png"/>
<h3>金融脱媒</h3>
<h4>一手资源，从融资方直接取得项目资源</h4>
</div>
</li>
<li>
<div>
<h3>1000亿</h3>
<h4>累计交易</h4>
</div>
<div>
<img src="/images/index/picture_01.png"/>
<h3>金融脱媒</h3>
<h4>一手资源，从融资方直接取得项目资源</h4>
</div>
</li>
<li>
<div>
<h3>1000亿</h3>
<h4>累计交易</h4>
</div>
<div>
<img src="/images/index/picture_01.png"/>
<h3>金融脱媒</h3>
<h4>一手资源，从融资方直接取得项目资源</h4>
</div>
</li>
</ul>
</div>
<div class="projects">
<header class="clear">
<div>
<div>
<a class="logo"></a>
</div>
</div>
<div>
<div>
<h3>推荐优质项目 领取高额介绍费</h3>
</div>
</div>
</header>
<section class="clear">
<div>
<p>
精选稀缺产品<br/>
非区非县，市级资产端一手政信
</p>
<p>
尽享高额佣金<br/>
远高市场佣金比例的返佣制度
</p>
<p>
完善风控体系<br/>
原招商银行风控团队层层把关
</p>
<p>
佣金快速结算<br/>
项目成立 T+0 ，帮您快速结佣
</p>
</div>
<div>
<div class="computer"></div>
</div>
</section>
</div>
<div class="products">
<ul>
{{#each products}}
<li class="clear">
<div style="background-image:url({{this.img}})"></div>
<div>
<h3>{{this.title}}</h3>
<div>
<span>
<strong>{{this.raiseTime}}</strong>天<br/>募集时间
</span>
<span>
<strong>{{this.raiseFunds}}</strong>亿<br/>募集资金
</span>
<span>
<strong>{{this.maxProfits}}</strong>%<br/>最高收益
</span>
</div>
<a href="{{this.link}}">查看详情 &gt;</a>
</div>
</li>
{{/each}}
</ul>
</div>
views/layout.hbs 0 → 100644
View file @ 27a4a8a8
<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<title>富豆优投</title>
<link rel="icon" href="/favicon.ico"/>
<link rel="stylesheet" href="/stylesheets/style.css"/>
<link rel="stylesheet" href="/stylesheets/{{page}}.css"/>
</head>
<body>
<header id="header">
<div class="container">
<a class="logo" href="/"><img src="/images/logo.png" alt="logo"></a>
<nav class="clear">
<span><a href="/">首页 / HOME</a></span>
<span><a href="/project">项目合作 / PROJECT</a></span>
<span><a href="/product">最新产品 / PRODUCT</a></span>
<span><a href="/about">关于我们 / ABOUT</a></span>
</nav>
</div>
</header>
<section id="container">
{{{body}}}
</section>
<footer id="footer">
<h3>全国客服热线 9:30-18:30</h3>
<h2>400-888-8888</h2>
<hr class="line-separate"/>
<address>浙江省杭州市余杭区良睦路1299号互联网村5-305 E-mail: <a href="mailto:hr@shuniu.com">hr@shuniu.com</a></address>
<p class="copyright">Copyright2016 <span>shuniu</span> All Right Reserved&copy;2014-2015 杭州枢纽科技有限公司 版权所有</p>
</footer>
<script src="/javascripts/jquery-1.8.3.min.js"></script>
<script src="/javascripts/{{page}}.js"></script>
</body>
</html>
www.fudou6.com.iml 0 → 100644
View file @ 27a4a8a8
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$" />
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="www.fudou6.com node_modules" level="project" />
</component>
</module>
\ No newline at end of file
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 to comment