软工第二次作业
码云：https://gitee.com/fengjixuan/codes/zqd26n4i8c91lbu0vkgst97
百度云文件：链接：链接：https://pan.baidu.com/s/1udr_BcMI9ePCy4IBnWx7iw
提取码：gbzm
网页预览图：
因项目文件过大，这里放上源代码：
<!DOCTYPE HTML>
<!--
<!--
-->
<html>
<head>
<title>小米官方网站</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="assets/css/main.css" />
</head>
<body class="is-preload">
<html>
<head>
<title>小米官方网站</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="assets/css/main.css" />
</head>
<body class="is-preload">
<!-- Header -->
<header id="header">
<a class="logo" href="index.html">MIUI</a>
<nav>
<a href="#menu">菜单</a>
</nav>
</header>
<header id="header">
<a class="logo" href="index.html">MIUI</a>
<nav>
<a href="#menu">菜单</a>
</nav>
</header>
<!-- Nav -->
<nav id="menu">
<ul class="links">
<li><a href="http://www.miui.com/download.html">miui下载</a></li>
<li><a href="http://www.miui.com/unlock/index.html">解锁</a></li>
<li><a href="www.miui.com/index.html">论坛</a></li>
<li><a href="https://www.mi.com/?client_id=180100041086&masid=17489.0001">商城</a></li>
<li><a href="https://www.mi.com/about/history/">发展经历</a></li>
</ul>
</nav>
<nav id="menu">
<ul class="links">
<li><a href="http://www.miui.com/download.html">miui下载</a></li>
<li><a href="http://www.miui.com/unlock/index.html">解锁</a></li>
<li><a href="www.miui.com/index.html">论坛</a></li>
<li><a href="https://www.mi.com/?client_id=180100041086&masid=17489.0001">商城</a></li>
<li><a href="https://www.mi.com/about/history/">发展经历</a></li>
</ul>
</nav>
<!-- Banner -->
<section id="banner">
<div class="inner">
<h1>小米公司</h1>
<p>为发烧而生”是小米的产品概念。小米公司创造了用互联网模式开发手机操作系统、发烧友参与开发改进的模式。小米还是继苹果、三星、华为之后第四家拥有手机芯片自研能力的科技公司。<br />
<a href="https://xin.baidu.com/detail/compinfo?pid=xlTM-TogKuTwzcJnGP0jxDDknK7qURq9UQmd&from=ps">---->点击了解更多</a> </p>
</div>
<video autoplay loop muted playsinline src="images/banner.mp4"></video>
</section>
<section id="banner">
<div class="inner">
<h1>小米公司</h1>
<p>为发烧而生”是小米的产品概念。小米公司创造了用互联网模式开发手机操作系统、发烧友参与开发改进的模式。小米还是继苹果、三星、华为之后第四家拥有手机芯片自研能力的科技公司。<br />
<a href="https://xin.baidu.com/detail/compinfo?pid=xlTM-TogKuTwzcJnGP0jxDDknK7qURq9UQmd&from=ps">---->点击了解更多</a> </p>
</div>
<video autoplay loop muted playsinline src="images/banner.mp4"></video>
</section>
<!-- Highlights -->
<section class="wrapper">
<div class="inner">
<header class="special">
<h2>小米生态链</h2>
<p>小米生态链有多种产品，手机，智能家居等，目前代表的有小米9手机，55寸小米电视，同时还发布了体重秤和一款智能的小米插线板。连同小米移动电源在内，这些产品都是小米生态链的产物。 </p>
</header>
<div class="highlights">
<section>
<div class="content">
<header>
<a href="#" class="icon fa-vcard-o"><span class="label">Icon</span></a>
<h3>MIUI系统</h3>
</header>
<p>MIUI是小米公司旗下基于Android系统深度优化、定制、开发的第三方手机操作系统，也是小米的第一个产品。从2010年8月16日首个内测版发布至今，MIUI目前已经拥有国内外2.8亿用户，覆盖55种语言，支持142个国家与地区。MIUI在Android系统基础上，针对中国用户进行了深度定制。</p>
<section class="wrapper">
<div class="inner">
<header class="special">
<h2>小米生态链</h2>
<p>小米生态链有多种产品，手机，智能家居等，目前代表的有小米9手机，55寸小米电视，同时还发布了体重秤和一款智能的小米插线板。连同小米移动电源在内，这些产品都是小米生态链的产物。 </p>
</header>
<div class="highlights">
<section>
<div class="content">
<header>
<a href="#" class="icon fa-vcard-o"><span class="label">Icon</span></a>
<h3>MIUI系统</h3>
</header>
<p>MIUI是小米公司旗下基于Android系统深度优化、定制、开发的第三方手机操作系统，也是小米的第一个产品。从2010年8月16日首个内测版发布至今，MIUI目前已经拥有国内外2.8亿用户，覆盖55种语言，支持142个国家与地区。MIUI在Android系统基础上，针对中国用户进行了深度定制。</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-files-o"><span class="label">Icon</span></a>
<h3>子品牌：红米</h3>
</header>
<p>红米是小米在2013年7月31日推出的全新产品线，第一款产品是红米手机。2019年1月3日上午10：00，小米官方正式宣布红米Redmi品牌独立。现有红米note7，note7pro等代表作</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-floppy-o"><span class="label">Icon</span></a>
<h3>米粉</h3>
</header>
<p> 小米手机的粉丝团亲称。小米手机米粉是指狂热支持小米手机的用户群体。小米手机坚持“为发烧而生”的设计理念，将全球最顶尖的移动终端技术与元器件运用到每款新品，小米手机超高的性价比及其文化赢得了广大米粉的青睐。</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-line-chart"><span class="label">Icon</span></a>
<h3>小米智能家居</h3>
</header>
<p>小米智能家居包括：电视盒子、笔记本、平板、穿戴设备、智能路由器、智能耳机音响、智能空调、扫地机器人等全面的人性化智能家居</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-paper-plane-o"><span class="label">Icon</span></a>
<h3>小米之家</h3>
</header>
<p>小米之家是小米公司成立的直营客户服务中心，为广大米粉提供小米手机及其配件自提、小米手机的技术支持等服务，是小米粉丝的交流场所。小米之家从2011年下半年开始建设，11月底前完成开放，小米已经在北京、上海、广州、深圳、南京、成都、武汉、珠海、郑州、长沙、无锡、东莞、济南、大连，同时开业。贵阳、厦门、青岛、沈阳、石家庄、唐山、宁波、苏州部署小米之家服务站。</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-qrcode"><span class="label">Icon</span></a>
<h3>市场概况</h3>
</header>
<p>目前，小米是全球第四大智能手机制造商，在30余个国家和地区的手机市场进入了前五名，特别是在印度，连续5个季度保持手机出货量第一。通过独特的“生态链模式”，小米投资、带动了更多志同道合的创业者，同时建成了连接超过1.3亿台智能设备的IoT平台。2018年7月9日，小米成功在香港主板上市，成为了港交所首个同股不同权上市公司，创造了香港史上最大规模科技股IPO，以及当时历史上全球第三大科技股IPO。 </p>
</div>
</section>
</div>
</div>
</section>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-files-o"><span class="label">Icon</span></a>
<h3>子品牌：红米</h3>
</header>
<p>红米是小米在2013年7月31日推出的全新产品线，第一款产品是红米手机。2019年1月3日上午10：00，小米官方正式宣布红米Redmi品牌独立。现有红米note7，note7pro等代表作</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-floppy-o"><span class="label">Icon</span></a>
<h3>米粉</h3>
</header>
<p> 小米手机的粉丝团亲称。小米手机米粉是指狂热支持小米手机的用户群体。小米手机坚持“为发烧而生”的设计理念，将全球最顶尖的移动终端技术与元器件运用到每款新品，小米手机超高的性价比及其文化赢得了广大米粉的青睐。</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-line-chart"><span class="label">Icon</span></a>
<h3>小米智能家居</h3>
</header>
<p>小米智能家居包括：电视盒子、笔记本、平板、穿戴设备、智能路由器、智能耳机音响、智能空调、扫地机器人等全面的人性化智能家居</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-paper-plane-o"><span class="label">Icon</span></a>
<h3>小米之家</h3>
</header>
<p>小米之家是小米公司成立的直营客户服务中心，为广大米粉提供小米手机及其配件自提、小米手机的技术支持等服务，是小米粉丝的交流场所。小米之家从2011年下半年开始建设，11月底前完成开放，小米已经在北京、上海、广州、深圳、南京、成都、武汉、珠海、郑州、长沙、无锡、东莞、济南、大连，同时开业。贵阳、厦门、青岛、沈阳、石家庄、唐山、宁波、苏州部署小米之家服务站。</p>
</div>
</section>
<section>
<div class="content">
<header>
<a href="#" class="icon fa-qrcode"><span class="label">Icon</span></a>
<h3>市场概况</h3>
</header>
<p>目前，小米是全球第四大智能手机制造商，在30余个国家和地区的手机市场进入了前五名，特别是在印度，连续5个季度保持手机出货量第一。通过独特的“生态链模式”，小米投资、带动了更多志同道合的创业者，同时建成了连接超过1.3亿台智能设备的IoT平台。2018年7月9日，小米成功在香港主板上市，成为了港交所首个同股不同权上市公司，创造了香港史上最大规模科技股IPO，以及当时历史上全球第三大科技股IPO。 </p>
</div>
</section>
</div>
</div>
</section>
<!-- CTA -->
<section id="cta" class="wrapper">
<div class="inner">
<h1>永远相信美好的事情即将发生</h1>
</div>
</section>
<!-- Testimonials -->
<section class="wrapper">
<div class="inner">
<header class="special">
<h2>小米的使命：始终坚持做“感动人心、价格厚道”的好产品，让全球每个人都能享受科技带来的美好生活</h2>
<p>8年前，小米公司成立时就有一个宏大的理想：改变商业世界中普遍低下的运作效率。小米有勇气、有决心、有毅力推动一场深刻的商业效率革命 ：把每一份精力都专心投入做好产品，让用户付出的每一分钱都足有所值。
在众多领域小米都以一流的品质、紧贴成本的定价彻底改变了行业面貌，大大加速了产品普及。“感动人心，价格厚道”这八个字是一体两面、密不可分的整体，远超用户预期的极致产品，还能做到“价格厚道”，才能真正“感动人心”。</p>
</header>
<div class="testimonials">
<section>
<div class="content">
<blockquote>
<p>黎万强，小米科技联合创始人，商业畅销书《参与感》作者。曾任小米MIUI负责人，创立了基于“用户开发模式”MIUI手机操作系统研发方法。后任小米网负责人，负责小米的市场营销、电商和服务。2014年12月，宣布闭关，休假并思考小米公司新战略项目。 黎万强是中国互联网新营销旗手，参与感、手机控、F码、米粉节等互联网热词的创造者。曾被《财富》评为“中国40岁以下的商界精英”，获得《第一财经周刊》评选的“2013中国商业创新50人”，获得光华龙腾奖2013年第九届“中国设计十大杰出青年”。 </p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic01.jpg" alt="" />
</div>
<p class="credit">- <strong>黎万强</strong> <span>联合创始人、高级副总裁、品牌战略官</span></p>
</div>
</div>
</section>
<section>
<div class="content">
<blockquote>
<p>他是一个非常睿智的人：大学三年级时就成为了百万富翁，凭帮人开发软件赚到了“第一桶金”；他是一个善于坚持的人：是他的坚持，最终带领金山团队帮助金山公司完成上市，并成为如今最大的多元化民族软件企业；他是一个有梦想的人：从前作为天使投资人帮助了无数创业者实现自己的梦想，如今重踏创业路，实现自己建立一个受世界尊敬的的企业的梦想 </p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic03.jpg" alt="" />
</div>
<p class="credit">- <strong>雷军</strong> <span>全国工商联副主席，小米科技创始人、董事长</span></p>
</div>
</div>
</section>
<section>
<div class="content">
<blockquote>
<p>1968年2月出生于广东广州，2006-2010林斌担任谷歌中国工程研究院副院长，谷歌全球工程总监，1995-2006林斌任职微软公司，历任软件开发工程师，主任开发工程师，研发经理，工程总监。2003年协助张宏江、张亚勤创办了微软亚洲工程院（ATC）。2010年和雷军等共同创办小米科技，并出任小米公司总裁。2018年10月，林斌以360亿元人民币财富位居2018年胡润百富榜第68位</p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic02.jpg" alt="" />
</div>
<p class="credit">- <strong>林斌</strong> <span>联合创始人、总裁</span></p>
</div>
</div>
</section>
</div>
</div>
</section>
<section id="cta" class="wrapper">
<div class="inner">
<h1>永远相信美好的事情即将发生</h1>
</div>
</section>
<!-- Testimonials -->
<section class="wrapper">
<div class="inner">
<header class="special">
<h2>小米的使命：始终坚持做“感动人心、价格厚道”的好产品，让全球每个人都能享受科技带来的美好生活</h2>
<p>8年前，小米公司成立时就有一个宏大的理想：改变商业世界中普遍低下的运作效率。小米有勇气、有决心、有毅力推动一场深刻的商业效率革命 ：把每一份精力都专心投入做好产品，让用户付出的每一分钱都足有所值。
在众多领域小米都以一流的品质、紧贴成本的定价彻底改变了行业面貌，大大加速了产品普及。“感动人心，价格厚道”这八个字是一体两面、密不可分的整体，远超用户预期的极致产品，还能做到“价格厚道”，才能真正“感动人心”。</p>
</header>
<div class="testimonials">
<section>
<div class="content">
<blockquote>
<p>黎万强，小米科技联合创始人，商业畅销书《参与感》作者。曾任小米MIUI负责人，创立了基于“用户开发模式”MIUI手机操作系统研发方法。后任小米网负责人，负责小米的市场营销、电商和服务。2014年12月，宣布闭关，休假并思考小米公司新战略项目。 黎万强是中国互联网新营销旗手，参与感、手机控、F码、米粉节等互联网热词的创造者。曾被《财富》评为“中国40岁以下的商界精英”，获得《第一财经周刊》评选的“2013中国商业创新50人”，获得光华龙腾奖2013年第九届“中国设计十大杰出青年”。 </p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic01.jpg" alt="" />
</div>
<p class="credit">- <strong>黎万强</strong> <span>联合创始人、高级副总裁、品牌战略官</span></p>
</div>
</div>
</section>
<section>
<div class="content">
<blockquote>
<p>他是一个非常睿智的人：大学三年级时就成为了百万富翁，凭帮人开发软件赚到了“第一桶金”；他是一个善于坚持的人：是他的坚持，最终带领金山团队帮助金山公司完成上市，并成为如今最大的多元化民族软件企业；他是一个有梦想的人：从前作为天使投资人帮助了无数创业者实现自己的梦想，如今重踏创业路，实现自己建立一个受世界尊敬的的企业的梦想 </p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic03.jpg" alt="" />
</div>
<p class="credit">- <strong>雷军</strong> <span>全国工商联副主席，小米科技创始人、董事长</span></p>
</div>
</div>
</section>
<section>
<div class="content">
<blockquote>
<p>1968年2月出生于广东广州，2006-2010林斌担任谷歌中国工程研究院副院长，谷歌全球工程总监，1995-2006林斌任职微软公司，历任软件开发工程师，主任开发工程师，研发经理，工程总监。2003年协助张宏江、张亚勤创办了微软亚洲工程院（ATC）。2010年和雷军等共同创办小米科技，并出任小米公司总裁。2018年10月，林斌以360亿元人民币财富位居2018年胡润百富榜第68位</p>
</blockquote>
<div class="author">
<div class="image">
<img src="images/pic02.jpg" alt="" />
</div>
<p class="credit">- <strong>林斌</strong> <span>联合创始人、总裁</span></p>
</div>
</div>
</section>
</div>
</div>
</section>
<!-- Footer -->
<footer id="footer">
<div class="inner">
<div class="content">
<section>
<h3>小米的愿景：和用户交朋友，做用户心中最酷的公司</h3>
<p>优秀的公司赚的是利润，卓越的公司赢的是人心。小米是一家少见的拥有“粉丝文化”的高科技公司。对于小米而言，用户非上帝，用户应是朋友。为感谢米粉的一路相伴，小米将4月6日这一天定为“米粉节”，每年4月初都会举办盛大活动与米粉狂欢。同时自2015年起，每年年底小米都会举办小米家宴，邀请米粉回家吃“团圆饭”。同时小米员工还会自发地为米粉手写10万张明信片，这是小米不一样的地方，是小米人发自内心、一笔一画亲手表达的情感，这是对愿景的最好诠释，这是和米粉交朋友的实际行动。 </p>
</section>
<section>
<h4>近日新闻</h4>
<ul class="alt">
<li><a href="https://www.mi.com/blackshark-game2/?cfrom=search">小米旗下黑鲨手机2上线</a></li>
<li><a href="https://www.mi.com/mi9/?cfrom=search">小米9标准版及全新透明版三周内发货</a></li>
<li><a href="https://s.weibo.com/weibo?q=%23%E7%B1%B3%E5%AE%B6%E6%89%8B%E6%8C%81%E6%97%A0%E7%BA%BF%E5%90%B8%E5%B0%98%E5%99%A8%23s">小米手持无线吸尘器在上线</a></li>
<li><a href="https://weibo.com/tv/v/HmAA5bVbl?fid=1034:4353838346358697">小米工程师实现了100W快充，17分钟充满4000mAh电池！</a></li>
</ul>
</section>
<section>
<h4>联系我们</h4>
<ul class="plain">
<li><a href="images/xxxxx.jpg"><i class="icon fa-twitter"> </i>Twitter</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-facebook"> </i>Facebook</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-instagram"> </i>QQ</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-github"> </i>微博</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-github"> </i>返回顶部</a></li>
</ul>
</section>
</div>
<div class="copyright">
</div>
</div>
</footer>
<footer id="footer">
<div class="inner">
<div class="content">
<section>
<h3>小米的愿景：和用户交朋友，做用户心中最酷的公司</h3>
<p>优秀的公司赚的是利润，卓越的公司赢的是人心。小米是一家少见的拥有“粉丝文化”的高科技公司。对于小米而言，用户非上帝，用户应是朋友。为感谢米粉的一路相伴，小米将4月6日这一天定为“米粉节”，每年4月初都会举办盛大活动与米粉狂欢。同时自2015年起，每年年底小米都会举办小米家宴，邀请米粉回家吃“团圆饭”。同时小米员工还会自发地为米粉手写10万张明信片，这是小米不一样的地方，是小米人发自内心、一笔一画亲手表达的情感，这是对愿景的最好诠释，这是和米粉交朋友的实际行动。 </p>
</section>
<section>
<h4>近日新闻</h4>
<ul class="alt">
<li><a href="https://www.mi.com/blackshark-game2/?cfrom=search">小米旗下黑鲨手机2上线</a></li>
<li><a href="https://www.mi.com/mi9/?cfrom=search">小米9标准版及全新透明版三周内发货</a></li>
<li><a href="https://s.weibo.com/weibo?q=%23%E7%B1%B3%E5%AE%B6%E6%89%8B%E6%8C%81%E6%97%A0%E7%BA%BF%E5%90%B8%E5%B0%98%E5%99%A8%23s">小米手持无线吸尘器在上线</a></li>
<li><a href="https://weibo.com/tv/v/HmAA5bVbl?fid=1034:4353838346358697">小米工程师实现了100W快充，17分钟充满4000mAh电池！</a></li>
</ul>
</section>
<section>
<h4>联系我们</h4>
<ul class="plain">
<li><a href="images/xxxxx.jpg"><i class="icon fa-twitter"> </i>Twitter</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-facebook"> </i>Facebook</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-instagram"> </i>QQ</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-github"> </i>微博</a></li>
<li><a href="images/xxxxx.jpg"><i class="icon fa-github"> </i>返回顶部</a></li>
</ul>
</section>
</div>
<div class="copyright">
</div>
</div>
</footer>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
</html>
