first commit

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/css/task1.css

@@ -0,0 +1,304 @@
+.header {
+    position: fixed;
+    width: 100%;
+    left: 0;
+    top: 0;
+    height: 0.9rem;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    z-index: 999;
+    border-bottom: 0.05rem solid #f8f8f8;
+    box-sizing: border-box;
+    background-color: #fff;
+    padding: 0 0.3rem;
+}
+
+.Shopping_Cart {
+    font-size: 0.5rem;
+}
+
+.edit {
+    font-size: 0.24rem;
+    right: 0.3rem;
+    bottom: 0.24rem;
+}
+
+.edit_a {
+    width: .48rem;
+}
+
+.content {
+    margin-top: 0.9rem;
+}
+
+.flagship {
+    padding: 0rem 0.23rem;
+    border-bottom: 0.14rem solid #f8f8f8;
+}
+.flagship_title {
+    padding: 0.26rem 0rem;
+    display: flex;
+    justify-content:space-between;
+    align-items: center;
+    border-bottom: solid #f8f8f8 0.01rem;
+}
+.select {
+    width: 0.38rem;
+	height: 0.38rem;
+	border: solid 0.03rem #9ea2b5;
+    border-radius: 50%;
+}
+.flagship_title_left {
+    display: flex;
+    align-items: center;
+}
+
+.flagship_title_left img {
+    margin-left: 0.21rem;
+    width: 0.32rem;
+	height: 0.32rem;
+    
+}
+
+.flagship_title_right {
+    width: 0.98rem;
+	height: 0.38rem;
+	background-color: #fcf2f1;
+	border-radius: 0.19rem;
+    font-size: 0.24rem;
+    color: #ea4e3d;
+    text-align: center;
+}
+
+.flagship_title_left span {
+    font-size: 0.3rem;
+	color: #333333;
+    margin-left: 0.12rem ;
+}
+
+.flagship_title_left i {
+    font-size: 0.03rem;
+    color: #cccccc;
+    margin-left: 0.14rem;
+}
+
+.activity {
+    display: flex;
+    justify-content: space-between;
+    height: 0.3rem;     
+    align-items: center;
+    margin: 0.19rem 0;
+}
+
+.activity_right {
+    font-size: 0.26rem;
+	color: #333333;
+    
+}
+
+.activity_left {
+    display: flex;
+    font-size: 0.24rem;
+	color: #333333;
+}
+
+.activity_left .full { 
+    width: 0.67rem;
+	height: 0.3rem;
+	background-color: #ea4e3d;
+	border-radius: 0.15rem;
+    font-size: 0.22rem;
+	color: #ffffff;
+    text-align: center;
+    line-height: 0.3rem;
+    margin-right: 0.1rem;
+    margin-left: 0.55rem ;
+}
+
+.activity_right i {
+    font-size: 12px;
+}
+.commodity {
+    
+}
+.commodity li { 
+    display: flex;
+    padding: 0.18rem 0 0.38rem 0;
+    justify-content: space-between;
+    align-items: center;
+
+}
+
+.commodity img {
+    width: 1.56rem;
+	height: 1.56rem;
+}
+.commodity_content {
+    width: 4.61rem;
+    height: 1.53rem;
+}
+
+.commodity_content_top {
+	font-size: 0.28rem;
+	color: #333333;
+}
+
+.commodity_content_center {
+    font-size: 0.24rem;
+	color: #999999;
+}
+
+.commodity_content_bottom {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.commodity_content_bottom_left {
+    font-size: 0.24rem;
+	color: #ea4e3d;
+}
+
+.commodity_content_bottom_right {
+    display: flex;
+    width: 1.76rem;
+	height: 0.46rem;
+	border-radius: 0.05rem;
+	border: solid 0.01rem #dbdbdb;
+}
+
+.commodity_content_bottom_right input {
+    width: 0.86rem;
+    border: none;
+    text-align: center;
+}
+.commodity_content_bottom_right div {
+    height: 0.46rem;
+    width: 0.46rem;
+    border-right: solid 0.01rem #dbdbdb;
+    font-size: 0.3rem;
+    text-align: center;
+} 
+.commodity_content_bottom_right div:last-child {
+    border-right: none;
+    border-left: solid 0.01rem #dbdbdb;
+}
+
+.out {
+    padding: 0rem 0.23rem;
+}
+
+.wu {
+    width: 0.36rem !important;
+	height: 0.7rem !important;
+}
+
+.tm {
+    opacity: 0.5;
+}
+.out {
+    border-bottom: none;
+}
+.recommend_title{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: #f8f8f8f8;
+    padding: 0.35rem 0;
+
+}
+.recommend_title img {
+    width: 0.39rem;
+	height: 0.17rem;
+}
+.recommend_title div {
+    margin: 0 0.17rem;
+    font-size: 0.28rem;
+	color: #333333;
+}
+.tj {
+    display: flex;
+    padding: 0 0.24rem;
+    justify-content: space-between;
+}
+.tj li {
+    display: flex;
+    justify-content: space-between;
+    flex-direction: column;
+    box-sizing: border-box;
+    flex-wrap: wrap;
+    padding:0 0.15rem 0.26rem 0.15rem;
+}
+
+.tj p{
+	font-size: 0.24rem;
+	color: #333333;
+    margin-bottom: 0.23rem;
+}
+
+.tj span{
+    font-size: 0.2rem;
+	color: #e34749;
+}
+
+.more {
+    height: 5rem;
+}
+
+.settlement {
+    width: 100%;
+    box-sizing: border-box;
+    padding:0 0.24rem;
+	height: 0.92rem;
+	background-color: #ffffff;
+    position: fixed;
+    left: 0;
+    bottom: 1rem;
+    font-size: 0.3rem;
+	color: #000000;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-top: solid 0.01rem rgba(153, 153, 153, 0.137);
+}
+.Select_all {
+    display: flex;
+    font-size: 0.28rem;
+	color: #333333;
+}
+.Select_all .select {
+    margin-right: 0.11rem;
+}
+
+.settlement_sub {
+    width: 1.92rem;
+	height: 0.66rem;
+	background-color: #5697f4;
+	border-radius: 0.33rem;
+    font-size: 0.28rem;
+	color: #fff;
+    line-height: 0.66rem;
+    text-align: center;
+}
+
+.footer_real {
+    width: 100%;
+	height: 1rem;
+	background-color: #000000;
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    padding:0 0.39rem;
+    
+}
+
+.footer_real li {
+    font-size: 0.3rem;
+	color: #ffffff;
+}

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/css/task2.css

@@ -0,0 +1,398 @@
+.header {
+  position: fixed;
+  width: 100%;
+  height: 0.9rem;
+  left: 0;
+  top: 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0.36rem;
+  z-index: 999;
+  background-color: #fff;
+}
+
+.content {
+  margin-top: 0.9rem;
+}
+
+.header_left {
+  width: 0.15rem;
+  height: 0.29rem;
+}
+
+.header_center {
+  width: 5.66rem;
+  height: 0.6rem;
+  background-color: #f2f2f2;
+  border-radius: 0.3rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.header_right {
+  width: 0.33rem;
+  height: 0.36rem;
+}
+
+.header_center img {
+  width: 0.32rem;
+  height: 0.34rem;
+  margin-left: 0.24rem;
+}
+
+.header_center input {
+  background-color: rgba(255, 255, 255, 0);
+  border: none;
+  flex: 1;
+}
+
+.turn {
+  position: relative;
+  width: 100%;
+}
+
+.turn img {
+  width: 100%;
+}
+
+.living {
+  position: absolute;
+  display: flex;
+  top: 0.97rem;
+  right: 0.25rem;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 0.98rem;
+	height: 1.28rem;
+	background-color: #ffffff80;
+	border-radius: 0.2rem;
+}
+
+.living img {
+  width: 0.45rem;
+	height: 0.45rem;
+  border-radius: 50%;
+}
+.living span {
+  zoom: 0.8;
+  font-size: 0.2rem;
+  color: #1b1b1b;
+  margin-top: 0.15rem;
+}
+.turn ul {
+  position: absolute;
+  display: flex;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0.25rem;
+  width: 0.75rem;
+  justify-content: space-between;
+}
+
+.msg {
+  background-color: #ffffff;
+  padding-bottom: 0.36rem;
+  padding-top: 0.49rem;
+  display: flex;
+  flex-direction: column;
+  padding-left: 0.3rem;
+  border-bottom: 0.07rem solid #fdfdfd;
+}
+
+.msg .msg_name {
+  height: 0.23rem;
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #1b1b1b;
+  margin-top: 0.24rem;
+}
+.Price {
+  display: flex;
+}
+.Price_left {
+  width: 1.43rem;
+  height: 0.26rem;
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #ea4e3d;
+}
+
+.Price_right {
+  height: 0.19rem;
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #737373;
+  text-decoration: line-through;
+}
+.deliver {
+  border-bottom: 0.07rem solid #fdfdfd;
+}
+
+.deliver_top {
+  display: flex;
+  justify-content: space-between;
+}
+.deliver_left {
+  display: flex;
+}
+.deliver span {
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #737373;
+  margin-right: 0.21rem;
+}
+.deliver img {
+  width: 0.19rem;
+  height: 0.25rem;
+  margin-right: 0.08rem;
+}
+.deliver p {
+  font-size: 0.2rem;
+  color: #000000;
+}
+
+.deliver div {
+  font-size: 0.2rem;
+  color: #737373;
+}
+
+.deliver_bottom {
+  display: flex;
+  justify-content: space-between;
+}
+
+.deliver_bottom i {
+  height: 0.26rem;
+  color: #aaaaaa;
+}
+
+li {
+  height: 0.68rem;
+  border-bottom: solid 0.01rem rgba(153, 153, 153, 0.199);
+  align-items: center;
+  margin-left: 0.38rem;
+  margin-right: 0.55rem;
+}
+
+li:last-child {
+  border-bottom: none;
+}
+.turn li {
+  width: 0.1rem;
+  height: 0.1rem;
+  background-color: #fff;
+  border-radius: 50%;
+  margin-left: 0rem;
+  margin-right: 0rem;
+}
+.turn li:first-child {
+  background-color: #ff7b41;
+}
+.li_left {
+  display: flex;
+}
+.li_left span {
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #737373;
+  margin-right: 0.21rem;
+}
+.li_left img {
+  width: 0.19rem;
+  height: 0.25rem;
+  margin-right: 0.08rem;
+}
+.li_left p {
+  font-size: 0.2rem;
+  color: #000000;
+}
+
+.li_left div {
+  font-size: 0.2rem;
+  color: #f09c48;
+  margin-right: 0.41rem;
+}
+
+.quantity li {
+  display: flex;
+  justify-content: space-between;
+}
+.quantity {
+  border-bottom: 0.07rem solid #fdfdfd;
+}
+.quantity i {
+  height: 0.26rem;
+  color: #aaaaaa;
+}
+
+.choice div {
+  font-size: 0.24rem;
+  letter-spacing: 0.005rem;
+  color: #2b2b2b;
+}
+
+.explain1 {
+  font-size: 0.2rem;
+  letter-spacing: 0.004rem;
+  color: #000000 !important;
+}
+
+.explain1 {
+  margin-right: 0.09rem !important;
+  align-items: baseline;
+}
+
+.shop {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0.52rem 0.27rem 0.58rem  0.24rem;
+}
+
+.shop img {
+  width: 0.78rem;
+  height: 0.78rem;
+  border-radius: 0.05rem;
+}
+
+.shop_right {
+  text-align: center;
+  line-height: 0.54rem;
+  width: 1.48rem;
+  height: 0.54rem;
+  border-radius: 0.27rem;
+  border: solid 0.01rem #4799ee;
+  font-size: 0.24rem;
+  color: #4799ee;
+}
+.shop_left {
+  display: flex;
+}
+.shop_left p {
+  font-size: 0.28rem;
+  letter-spacing: 0.014rem;
+  color: #000000;
+}
+
+.shop_left span {
+  font-size: 0.22rem;
+  color: #999999;
+}
+
+.shop_left div {
+  height: 0.78rem;
+  display: flex;
+  flex-direction: column;
+  margin-left: 0.21rem;
+}
+.Commodity_information {
+  width: 100%;
+  height: 0.83rem;
+  background-color: #ffffff;
+  font-size: 0.2rem;
+  line-height: 0.83rem;
+  letter-spacing: 0.01rem;
+  text-align: center;
+  color: #979696;
+}
+
+.none {
+  height: 3.5rem;
+}
+
+.footer {
+  position: fixed;
+  z-index: 999;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: 0.98rem;
+  background-color: #ffffff;
+  border: solid 0.01rem #f4f4f4;
+  display: flex;
+  justify-content: space-between;
+  padding-left: 0.41rem;
+  padding-right: 0.3rem;
+  box-sizing: border-box;
+  align-items: center;
+}
+
+.purchase {
+  width: 4.2rem;
+  height: 0.68rem;
+  border-radius: 0.34rem;
+  display: flex;
+  text-align: center;
+  line-height: 0.68rem;
+}
+
+.purchase .shopcar {
+  width: 2.1rem;
+  height: 0.68rem;
+  background-color: #f5f2f2;
+  border-radius: 0.34rem 0rem 0rem 0.34rem;
+  font-size: 0.28rem;
+  letter-spacing: 0.006rem;
+  color: #747474;
+  position: relative;
+}
+
+.purchase .purchase_ {
+  width: 2.1rem;
+  height: 0.68rem;
+  background-color: #5697f4;
+  border-radius: 0rem 0.34rem 0.34rem 0rem;
+  font-size: 0.28rem;
+  letter-spacing: 0.006rem;
+  color: #ffffff;
+}
+
+.footer span {
+    font-size: 0.2rem;
+	letter-spacing: 0.02rem;
+	color: #999999;
+    width: 0.9rem;
+    text-align: center;
+}
+
+.footer ul {
+    display: flex;
+}
+
+.footer img {
+    width: 0.41rem;
+	height: 0.36rem;
+}
+.footer ul li{
+    border-bottom:none;
+    margin:0;
+    margin-right: 0.46rem;
+    width: 0.rem;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    justify-content: center;
+}
+.shopcar_a {
+  position: relative;
+}
+.shopcar_c {
+  position: absolute;
+  width: 0.34rem;
+	height: 0.24rem;
+	background-color: #ffffff;
+	border-radius: 0.12rem;
+	border: solid 0.01rem #ea4e3d;
+  font-size: 0.2rem;
+	color: #ea4e3d;
+  text-align: center;
+  line-height: 0.24rem;
+  right: 0;
+  top: -0.1rem;
+}

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/css/task3.css

@@ -0,0 +1,61 @@
+.header {
+    position: fixed;
+    width: 100%;
+    height: 0.9rem;
+    left: 0;
+    top: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    box-sizing: border-box;
+    z-index: 999;
+    background-color: #fff;
+    font-size: 0.4rem;
+	 color: #1b1b1b;
+  }
+
+  .header img {
+    width: 0.15rem;
+	height: 0.29rem;
+    position: absolute;
+    left: 0.42rem;
+  }
+  .content {
+      margin-top: 2.4rem;
+      width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-direction: column;
+    height: 5.1rem;
+  }
+
+  .content img {
+    width: 1.56rem;
+	height: 1.92rem;
+  }
+
+  p {
+    font-size: 0.34rem;
+    color: #2b2b2b;
+  }
+
+  p span {
+    color: #ea4e3d;
+  }
+
+  .msg {
+    font-size: 0.28rem;
+	color: #aaaaaa;
+  }
+
+  .details {
+    width: 5.8rem;
+	height: 0.66rem;
+	background-color: #5697f4;
+	border-radius: 0.33rem;
+    font-size: 0.28rem;
+	color: #ffffff;
+    text-align: center;
+    line-height: 0.66rem;
+}

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/cy.html

@@ -0,0 +1,7 @@
+position: fixed;
+    width: 100%;
+    left: 0;
+    top: 0;
+
+
+    

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/js/rom.js

@@ -0,0 +1,11 @@
+window.onload = function () {
+        getRem(750, 100)
+    };
+    window.onresize = function () {
+        getRem(750, 100)
+    };
+    function getRem(pwidth, prem) {
+        var html = document.getElementsByTagName("html")[0];
+        var oWidth = document.body.clientWidth || document.documentElement.clientWidth;
+        html.style.fontSize = oWidth / pwidth * prem + "px";
+    }

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/task1.html

@@ -0,0 +1,161 @@
+<!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>Document</title>
+    <link rel="stylesheet" href="../clear.css">
+    <link rel="stylesheet" href="css/public.css">
+    <link rel="stylesheet" href="css/task1.css">
+    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2881065_5znv7t2vnug.css">
+</head>
+
+<body>
+    <div class="header">
+        <div class="edit_a"></div>
+        <div class="Shopping_Cart">购物车</div>
+        <div class="edit">编辑</div>
+    </div>
+    <div class="content">
+        <div class="flagship">
+            <div class="flagship_title">
+                <div class="flagship_title_left">
+                    <div class="select"></div>
+                    <img src="img/shopimg.png" alt="">
+                    <span>官方旗舰店</span>
+                    <i class="iconfont icon-fanye"></i>
+                </div>
+                <div class="flagship_title_right">优惠券</div>
+            </div>
+            <div class="activity">
+                <div class="activity_left">
+                    <div class="full">满减</div>
+                    满100减5元优惠活动，付款减5元
+                </div>
+                <div class="activity_right">
+                    再逛逛
+                    <i class="iconfont icon-fanye"></i>
+                </div>
+            </div>
+            <ul class="commodity">
+                <li>
+                    <div class="select"></div>
+                    <img src="img/tv.png" alt="">
+                    <div class="commodity_content">
+                        <div class="commodity_content_top">旗舰店111111KD-55X9000E 55英K HDR智能液晶电视银色</div>
+                        <div class="commodity_content_center">银色，65寸</div>
+                        <div class="commodity_content_bottom">
+                            <div class="commodity_content_bottom_left">¥5,999.00</div>
+                            <di class="commodity_content_bottom_right">
+                                <div>-</div>
+                                <input type="text" value="1">
+                                <div class="c_r">+</div>
+                            </di>
+                        </div>
+                    </div>
+                </li>
+                <li>
+                    <div class="select"></div>
+                    <img src="img/tv.png" alt="">
+                    <div class="commodity_content">
+                        <div class="commodity_content_top">旗舰店111111KD-55X9000E 55英K HDR智能液晶电视银色</div>
+                        <div class="commodity_content_center">银色，65寸</div>
+                        <div class="commodity_content_bottom">
+                            <div class="commodity_content_bottom_left">¥5,999.00</div>
+                            <di class="commodity_content_bottom_right">
+                                <div>-</div>
+                                <input type="text" value="1">
+                                <div class="c_r">+</div>
+                            </di>
+                        </div>
+                    </div>
+                </li>
+            </ul>
+        </div>
+        <div class="flagship out">
+            <div class="flagship_title">
+                <div class="flagship_title_left">
+                    <div class="select"></div>
+                    <img src="img/shopimg.png" alt="">
+                    <span>海外自营</span>
+                    <i class="iconfont icon-fanye"></i>
+                </div>
+                <div class=""></div>
+            </div>
+            <ul class="commodity">
+                <li>
+                    <div class="select"></div>
+                    <img src="img/tv.png" alt="">
+                    <div class="commodity_content">
+                        <div class="commodity_content_top">旗舰店111111KD-55X9000E 55英K HDR智能液晶电视银色</div>
+                        <div class="commodity_content_center">银色，65寸</div>
+                        <div class="commodity_content_bottom">
+                            <div class="commodity_content_bottom_left">¥5,999.00</div>
+                            <di class="commodity_content_bottom_right">
+                                <div>-</div>
+                                <input type="text" value="1">
+                                <div class="c_r">+</div>
+                            </di>
+                        </div>
+                    </div>
+                </li>
+                <li class="tm">
+                    <img src="img/wu.png" class="wu" alt="">
+                    <img src="img/tv.png" alt="">
+                    <div class="commodity_content">
+                        <div class="commodity_content_top">旗舰店111111KD-55X9000E 55英K HDR智能液晶电视银色</div>
+                        <div class="commodity_content_center">银色，65寸</div>
+                        <div class="commodity_content_bottom">
+                            <div class="commodity_content_bottom_left">¥5,999.00</div>
+                            </di>
+                        </div>
+                    </div>
+                </li>
+            </ul>
+        </div>
+        <div class="recommend">
+            <div class="recommend_title">
+                <img src="img/left.png" alt="">
+                 <div>为您推荐</div>
+                <img src="img/right.png" alt="">
+            </div>
+            <ul class="tj">
+                <li class="">
+                    <img src="img/tv.png" alt="">
+                    <p>爱图图正1.5匹 定速 品圆冷暖 壁挂式空调 KFR-35...</p>
+                    <span>¥3999.00</span>
+                </li>
+                <li class="">
+                    <img src="img/tv.png" alt="">
+                    <p>爱图图正1.5匹 定速 品圆冷暖 壁挂式空调 KFR-35...</p>
+                    <span>¥3999.00</span>
+                </li>
+            </ul>
+        </div>
+    </div>
+    <div class="more">
+
+    </div>
+    <div class="footer">
+        <div class="settlement">
+            <div class="Select_all">
+                <div class="select"></div>
+                <p>全选</p>
+            </div>
+            <span>合计： ￥5900.00</span>
+            <div class="settlement_sub">结算</div>
+        </div>
+    </div>
+    <ul class="footer_real">
+        <li>首页</li>
+        <li>好友</li>
+        <li>购物车</li>
+        <li class="footer_Select">圈子</li>
+        <li>我的</li>
+    </ul>
+</body>
+<script src="js/rom.js"></script>
+
+</html>

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/task2.html

@@ -0,0 +1,126 @@
+<!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>Document</title>
+    <link rel="stylesheet" href="../clear.css">
+    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2881065_5znv7t2vnug.css">
+    <link rel="stylesheet" href="css/task2.css">
+    <link rel="stylesheet" href="css/public.css">
+
+</head>
+<body>
+    <div class="header">
+        <img class="header_left" src="img/return.png"></img>
+        <div class="header_center">
+            <img src="img/search.png" alt="">
+            <input type="text">
+        </div>
+        <img class="header_right" src="img/share.png" ></img>
+    </div>
+    <div class="content">
+         <div class="turn">
+             <img src="img/bg53.png" alt="">
+             <div  class="living">
+                 <img src="img/live.png" alt="">
+                 <span>正在直播</span>
+             </div>
+             <ul>
+                 <li></li>
+                 <li></li>
+                 <li></li>
+             </ul>
+         </div>
+         <div class="msg">
+             <div class="Price">
+                 <div class="Price_left">￥ 159.00</div>
+                 <div class="Price_right">￥ 199.00</div>
+             </div>
+             <div class="msg_name">【大牌驾到】NBA新款秋季女鞋NBA新款秋季女鞋</div>
+         </div>
+         <ul class="deliver">
+             <li class="deliver_top">
+                 <div class="li_left">
+                    <span>发货</span>
+                    <img src="img/position.png" alt="">
+                    <p>浙江杭州 | 快递：0.00</p>
+                 </div>
+                 <div class="deliver_right">月销 1</div>
+             </li>
+             <li class="deliver_bottom">
+                <div class="deliver_left">
+                    <span>发货</span>
+                    <img src="img/position.png" alt="">
+                    <p>浙江杭州 | 快递：0.00</p>
+                 </div>
+                 <i class="iconfont icon-fanye"></i>
+             </li>
+         </ul>
+         <ul class="quantity">
+             <li class="collect_coupons">
+                <div class="li_left">
+                    <span>领券</span>
+                    <div class="collect1">满100减8</div>
+                    <div class="collect2">满200减30</div>
+                </div>
+                <i class="iconfont icon-fanye"></i>
+             </li>
+             <li class="choice">
+                <div class="li_left">
+                    <span>领券</span>
+                    <div class="collect1">已选  黑色，38, 1件</div>
+                </div>
+                <i class="iconfont icon-fanye"></i>
+             </li>
+             <li class="explain">
+                <div class="li_left">
+                    <span>领券</span>
+                    <div class="explain1">
+                        <i class="iconfont icon-bofang"></i>
+                        支持48小时快速退款
+                    </div>
+                    <div class="explain1">
+                        <i class="iconfont icon-bofang"></i>
+                        支持7天无忧退换货
+                    </div>
+                </div>
+                <i class="iconfont icon-fanye"></i>
+             </li>
+         </ul>
+         <div class="shop">
+             <div class="shop_left">
+                 <img src="img/shop.png" alt="">
+                 <div>
+                     <p>某某女鞋店</p>
+                     <span>粉丝3.4万 </span>
+                 </div>
+             </div>
+             <div class="shop_right">进店逛逛</div>
+         </div>
+         <div class="Commodity_information">商品信息</div>
+         <div class="none"></div>
+    </div>
+    <div class="footer">
+        <ul>
+            <li>
+                <img src="img/shopimg.png" alt="">
+                <span>店铺</span>
+            </li>
+            <li class="shopcar_a">
+                <img src="img/shopcar.png" alt="">
+                <span>购物车</span>
+                <div class="shopcar_c">24</div>
+            </li>
+        </ul>
+        <div class="purchase">
+            <div class="shopcar">加入购物车
+                
+            </div>
+            <div class="purchase_">立即购买</div>
+        </div>
+    </div>
+</body>
+<script src="js/rom.js"></script>
+</html>

历届学生/fontendsix/项目练习/学生项目/王安民/10-26/task3.html

@@ -0,0 +1,28 @@
+<!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>Document</title>
+    <link rel="stylesheet" href="../clear.css">
+    <link rel="stylesheet" href="css/public.css">
+    <link rel="stylesheet" href="css/task3.css">
+</head>
+<body>
+    <div class="header">
+        <img src="img/fh.png" alt="">
+        退款进度
+    </div>
+    <div class="content">
+        <img src="img/y.png" alt="">
+        <p>
+            <span>259.98</span>
+            元，退款成功
+        </p>
+        <div class="msg">商家已经同意您的退款申请</div>
+        <div class="details">查看详情</div>
+    </div>
+</body>
+<script src="js/rom.js"></script>
+</html>