master

分支 (1)

管理

管理

master

cnproject
/
logistics.html

<!--
 * @Author:
 * @Date: 2021-08-14 23:02:21
 * @LastEditTime: 2021-08-17 11:46:38
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vs-code项目文件\HTML-CSS\CainiaoYizhan\logistics.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>物流科技</title>
    <link rel="icon" type="image/png" href="./images/icon/titlt_logo.png">
    <!-- 外部引入：第三方  公共的   对应业务 -->
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.15.3/css/fontawesome.css" rel="stylesheet">
    <link rel="stylesheet" href="./css/logistics.css">
    <link rel="stylesheet" href="./bootstrap-4.5.0-dist/css/bootstrap.css">
    <link rel="stylesheet" href="./css/common.css">
    <script src="js/jquery-3.6.0.min.js"></script>
    <script src="bootstrap-4.5.0-dist/js/bootstrap.js"></script>
</head>

<body>

    <!--头部简单：开始-->
    <header id="head-top">

    </header>

    <!--头部简单：结束-->
    <header id="head-search">

    </header>

    <!--第三部分,轮播图-->
    <section id="lunbo1">
        <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
              <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
              <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
              <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner">
              <div class="carousel-item active">
                <video muted loop autoplay src="./images/logistics/threeSection-lunbo/lunbo-1.mp4" class="d-block w-100"></video>
                <div class="carousel-caption d-none d-md-block">
                  <h5>科技让物流更美好</h5>
                  <p>TECHNOLOGY MAKES LOGISTICS SIMPLE</p>
                </div>
              </div>
              <div class="carousel-item">
                <img src="./images/logistics/threeSection-lunbo/lunbo-2.jpg" class="d-block w-100">
                <div class="carousel-caption d-none d-md-block">
                  <h5>地理位置服务</h5>
                  <p>专注提升用户地址录入体验，优化平台地址数据质量 提供专业定义并解析业务范围的数据能力</p>
                </div>
              </div>
              <div class="carousel-item">
                <img src="./images/logistics/threeSection-lunbo/lunbo-3.jpg" class="d-block w-100" alt="...">
                <div class="carousel-caption d-none d-md-block">
                  <h5>数字空间服务</h5>
                  <p>聚焦物流领域中的仓、转运中心、货站、网点、驿站等场景，为各场景数字化提供基础的三维数字空间能力，可将场所空间、设备、车、人等物流要素数字化，
                    实现真实世界到数字世界的映射，为人效管理、车辆调度、异常管理、仓储布局、库容可视化提供基础工具</p>
                </div>
              </div>
            </div>
            <button class="carousel-control-prev" type="button" data-target="#carouselExampleCaptions"  data-slide="prev">
              <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </button>
            <button class="carousel-control-next" type="button" data-target="#carouselExampleCaptions"  data-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </button>
          </div>
    </section>

    <!--第四部分,大数据生态，人工智能，云计算，IoT-->
    <section id="fourSection">
    <div >
        <div class="div3 inline2 ftSize1">123</div>
        <div class="div4 inline2 ftSize1">大数据生态</div>
        <div class="div4 inline2 ftSize1">人工智能</div>
        <div class="div4 inline2 ftSize1">云计算</div>
        <div class="div4 inline2 ftSize1">IOT</div>
        <div class="div3 inline2 ftSize1">123</div>
    </div>

    <div >
        <div class="div3 inline2 ftSize2">123</div>
        <div class="div4 inline2 ftSize2">用数据驱动科技，赋能物流</div>
        <div class="div4 inline2 ftSize2">基于机器视觉、智能语音、</div>
        <div class="div4 inline2 ftSize2">聚焦物流行业，提供丰富、</div>
        <div class="div4 inline2 ftSize2">提供专业的物联网能力服</div>
        <div class="div3 inline2 ftSize2">123</div>
    </div>

    <div >
        <div class="div3 inline2 ftSize2">123</div>
        <div class="div4 inline2 ftSize2">行业</div>
        <div class="div4 inline2 ftSize2">机器学习能 力助力物流行业</div>
        <div class="div4 inline2 ftSize2">安全、稳定 的云计算产品及</div>
        <div class="div4 inline2 ftSize2">务，实现物 流全流程管控</div>
        <div class="div3 inline2 ftSize2">123</div>
    </div>

    <div >
        <div class="div3 inline2 ftSize2">123</div>
        <div class="div3 inline2 ftSize2">123</div>
        <div class="div4 inline2 ftSize2">实现降本增效</div>
        <div class="div4 inline2 ftSize2">服务</div>
        <div class="div3 inline2 ftSize2">123</div>
        <div class="div3 inline2 ftSize2">123</div>
    </div>

    </section>

<!--第五部分,明星产品-->
    <section  id="fiveSection">
     <div>
        <p>菜鸟致力于打造一个数据驱动、开放、协同、共享的社会化物流平台，
            有40%以上员工从事技术岗位，
            利用物联网、人工智能、大数据、无人技术等物流科技结合物流行业数智化升级的痛点和需求，
            聚焦于物流新技术和新产品的研发，已经广泛服务物流行业的企业，
            对于物流行业的降本提效产生了重要的促进作用，共同助力物流行业数字化转型升级。</p>
     </div>
     <div class="fg">
         <h1 class="ftSize2">明星产品</h1>
         <span class="ftSize1">RECOMMENDEN PRODUCTS</span>
     </div>
    </section>

    <!--地址质量服务，地址范围管理，路径规划算法，短信服务
    智能语音，云服务器ECS，物流详情订阅服务，物流详情查询服务-->
    <section id="sixSection">
       <div>
           <div class="inline1">
               <div><img src="./images/logistics/sixSection/6-1.jpg"></div>
               <div id="gundongtiao">
                   <div class="ftSize1">地质质量服务</div>
                   <div class="ftSize2">地址质量服务是辅助便捷的录入高质量文本地址的一系列能力</div>
                </div>
                <div><a href="#" class="button">立即订购</a></div>
           </div>

           <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-2.jpg"></div>
            <div id="gundongtiao">
                <div class="ftSize1">地址范围管理</div>
                <div class="ftSize2">地理范围管理服务是专为业务范围管理类场景设计,用于定义业务范围,并根据地址或者坐标解析业务范围的系列能力</div>
            </div>
            <div><a href="#" class="button">立即订购</a></div>
           </div>

           <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-3.jpg"></div>
            <div id="gundongtiao">
                <div class="ftSize1">地质质量服务</div>
                <div class="ftSize2">地址质量服务是辅助便捷的录入高质量文本地址的一系列能力</div>
            </div>
            <div><a href="#" class="button">立即咨询</a></div>
           </div>

           <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-4.jpg"></div>
            <div id="gundongtiao">
                <div class="ftSize1">路径规划算法</div>
                <div class="ftSize2">车辆路径规划服务将订单信息和可用车辆信息进行智能匹配,结合多种限制因素,给出每辆车的最优订单配送顺序和路径</div>
            </div>
            <div><a href="#" class="button">立即订购</a></div>
           </div>
       </div>

       <div>
        <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-5.jpg"></div>
               <div id="gundongtiao">
                   <div class="ftSize1">智能语音</div>
                   <div class="ftSize2">智能语音,是基于语音识别、语音合成、自然语言理解等技术</div>
                </div>
            <div><a href="#" class="button">立即咨询</a></div>
        </div>
        <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-6.jpg"></div>
               <div id="gundongtiao">
                   <div class="ftSize1">云服务器ECS</div>
                   <div class="ftSize2">云服务器ECS是一种弹性可伸缩的计算服务,助您降低IT成本,提升运维效率,使您更专注于核心业务创新</div>
                </div>
            <div><a href="#" class="button">立即订购</a></div>
        </div>
        <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-7.jpg"></div>
               <div id="gundongtiao">
                   <div class="ftSize1">物流详情订阅服务</div>
                   <div class="ftSize2">对所有的订阅运单,客户可自动获取运单的轨迹节点信息</div>
            </div>
            <div><a href="#" class="button">立即订购</a></div>
        </div>
        <div class="inline1">
            <div><img src="./images/logistics/sixSection/6-8.jpg"></div>
               <div id="gundongtiao">
                   <div class="ftSize1">物流详情查询服务</div>
                   <div class="ftSize2">使用物流详情查询服务客户可在平台上随时查询运单在当前时"刻的轨迹节点信息</div>
                </div>
            <div><a href="#" class="button">立即订购</a></div>
        </div>

       </div>

    </section>
    <!--第七部分,物流科技产品-->
    <section id="sevSection">
        <div class="fg">
            <h1 class="ftSize2">物流科技产品矩阵</h1>
            <span class="ftSize1">RECOMMENDEN PRODUCTS</span>
        </div>


    </section>
    <!--第八部分，解决方案-->
    <section id="niSection">
        <div class="fg">
            <h1 class="ftSize2">解决方案</h1>
            <span class="ftSize1">CUSTOMIZED SOLUTIONS</span>
        </div>
        <!--解决方案的轮播图-->
        <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
            <div class="carousel-inner">
              <div class="carousel-item active">
                <div style="font-size: 10px;text-align: center;">心怀壮志的个人与组织，他们希望通过软件的力量，来提升现有的事业。我们帮助他们构</div>
                <img src="./images/logistics/jiejuefangan-lunbo/AOI智能分区.jpg" class="d-block w-100" alt="...">
                <p style="font-size: 32px; color: black; text-align: center;padding-top:10px;">AOI智能分区解决方案</p>
              </div>
              <div class="carousel-item">
                <div style="font-size: 10px;text-align: center;">心怀壮志的个人与组织，他们希望通过软件的力量，来提升现有的事业。我们帮助他们构</div>
                <img src="./images/logistics/jiejuefangan-lunbo/jijianjiejue.jpg" class="d-block w-100" alt="...">
                <p style="font-size: 32px; color: black; text-align: center;padding-top:10px;">寄件解决方案</p>
              </div>
              <div class="carousel-item">
                <div style="font-size: 10px;text-align: center;">心怀壮志的个人与组织，他们希望通过软件的力量，来提升现有的事业。我们帮助他们构</div>
                <img src="./images/logistics/jiejuefangan-lunbo/shuzikongjian.jpg" class="d-block w-100" alt="...">
                <p style="font-size: 32px; color: black; text-align: center;padding-top:10px;">数字空间解决方案</p>
              </div>
              <div class="carousel-item">
                <div style="font-size: 10px;text-align: center;">心怀壮志的个人与组织，他们希望通过软件的力量，来提升现有的事业。我们帮助他们构</div>
                <img src="./images/logistics/jiejuefangan-lunbo/zhinengshiping.jpg" class="d-block w-100" alt="...">
                <p style="font-size: 32px; color: black; text-align: center;padding-top:10px;">智能视频解决方案</p>
              </div>
            </div>
           <button class="carousel-control-prev" type="button" data-target="#carouselExampleControls"  data-slide="prev">
              <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </button>
            <button class="carousel-control-next" type="button" data-target="#carouselExampleControls"  data-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </button>
          </div>

    </section>
    <!--第九部分，得到物流行业领先公司的青睐-->
    <section id="jiuSection">
        <div class="fg">
            <h1 class="ftSize2">得到物流行业领先公司的青睐</h1>
            <span class="ftSize1">LEADING COMPANIES ARE USING OUR PRODUCTS</span>
        </div>
       <!--客户故事-->
       <div><p style="font-size: 46px;">客户故事</p></div>
       <div style="font-size: 20px;">心怀壮志的个人与组织，他们希望通过软件的力量，来提升现有的事业。我们帮助他们构</div>
       <div style="font-size: 20px;">想、设计和实现。这里是最新我们帮助他们构想、设计和实现。这里是最新案例</div>
       <!--轮播图-->
       <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
          <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
          <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
          <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner">
          <div class="carousel-item active">
            <img src="./images/logistics/qinglia-lunbo/1.png" class="d-block w-100" alt="...">
            <div class="carousel-caption d-none d-md-block">
              <!-- <h5>First slide label</h5>
              <p>Some representative placeholder content for the first slide.</p> -->
            </div>
          </div>
          <div class="carousel-item">
            <img src="./images/logistics/qinglia-lunbo/2.png" class="d-block w-100" alt="...">
            <div class="carousel-caption d-none d-md-block">
              <!-- <h5>Second slide label</h5>
              <p>Some representative placeholder content for the second slide.</p> -->
            </div>
          </div>
          <div class="carousel-item">
            <img src="./images/logistics/qinglia-lunbo/1.png" class="d-block w-100" alt="...">
            <!-- <div class="carousel-caption d-none d-md-block">
              <h5>Third slide label</h5>
              <p>Some representative placeholder content for the third slide.</p>
            </div> -->
          </div>
        </div>
        <button class="carousel-control-prev" type="button" data-target="#carouselExampleCaptions"  data-slide="prev">
          <span class="carousel-control-prev-icon" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
        </button>
        <button class="carousel-control-next" type="button" data-target="#carouselExampleCaptions"  data-slide="next">
          <span class="carousel-control-next-icon" aria-hidden="true"></span>
          <span class="sr-only">Next</span>
        </button>
      </div>
       <!--轮播图结束-->
    </section>

    <!--第十部分-->
    <section id="tenSection">
        <img src="images/logistics/tenSection/10-1.jpg">
    </section>
    <!--第十一部分，尊享数智供应链服务-->
    <section id="elSection">
        <!-- <img src="images/logistics/elSection/11-1.jpg"> -->
        <!--form表单的写法-->
        <div id="divform">
            <h1 class="ftWeight1 ftSize1">尊享数智供应链服务</h1>
            <div class="ftWeight1 ftSize2">留下联系方式:</div>

            <div class="divP"><label for="fname"><span style="color:red;">*</span>企业名称</label></div>
            <input type="text" id="fname" name="firstname" placeholder="您的企业名称">

            <div class="divP"><label for="lname"><span style="color:red;">*</span>姓名</label></div>
            <input type="text" id="lname" name="lastname" placeholder="您的姓名">

            <div class="divP"><label for="tel"><span style="color:red;">*</span>联系电话</label></div>
            <input type="text" id="tel" name="telephone" placeholder="您的联系电话">

             <div class="divP"> <label for="tel">使用场景</label></div>
             <textarea name="descr" id="descr" placeholder="场景描述内容"></textarea>

            <div class="divBt"><input type="submit" value="Submit"></div>

        </div>

    </section>


    <footer id="last-footer"></footer>
</body>
</html>