diff --git a/index.html b/index.html
new file mode 100644
index 0000000..1be6865
--- /dev/null
+++ b/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="zh">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<meta http-equiv="X-UA-Compatible" content="ie=edge">
+	<title></title>
+	<script type="text/javascript" src="js/jquery.1.7.1.min.js"></script>
+	<link rel="stylesheet" type="text/css" href="css/public.css"/>
+	<link rel="stylesheet" type="text/css" href="css/index.css"/>
+	<script type="text/javascript">
+		/*导入头部和尾部*/
+		$(document).ready(function(){
+		   $(".header").load("./header.html");
+		   $(".footer").load("./footer.html");  
+		});
+	</script>
+</head>
+<body>
+	<div class="header"></div>
+	<div class="banner center-box">
+		<ul class="banner-img">
+			<li class="active img-item"><img src="img/banner01.jpg"/></li>
+			<li class="img-item"><img src="img/banner02.jpg"></li>
+			<li class="img-item"><img src="img/banner03.jpg"></li>
+		</ul>
+		<ul class="controlLr">
+			<li class="pre"> pre </li>
+			<li class="next">next </li>
+		</ul>
+		<ul class="point-info">
+			<li class="point current" data-index = "0"></li>
+			<li class="point" data-index = "1"></li>
+			<li class="point" data-index = "2"></li>
+		</ul>
+	</div>
+	<div class="main center-box">
+		<div class="spc-sale">
+			<h2>今日特卖</h2>
+			<ul id="spc-info" class="flex-f2">
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+				<li class="item">
+					<img src="img/1.jpg" />
+					<h3>小米11 青春活力版</h3>
+					<p class="name-info">轻薄5G 内外皆出彩</p>
+					<p class="info-sale">1999元起</p>
+				</li>
+			</ul>
+		</div>
+	</div>
+	<div class="footer"></div>
+</body>
+</html>
+<script type="text/javascript" src="js/imgScroll.js"></script>
+<script type="text/javascript" src="js/index.js"></script>
\ No newline at end of file
