摘要：<div class="focus"> <!-- 小米闪购 --> <div class="focus_shop"> <p
<div class="focus">
<!-- 小米闪购 -->
<div class="focus_shop">
<p>小米闪购</p>
<!--小米闪购左图1-->
<div class="focus_shop_1"style="margin-right:10.25px;border-top:1px solid RGB(229,57,53);background:RGB(241,237,237)">
<div class="focus_shopTime">18:00 场</div>
<div class="focus_shopTitle1 fa fa-flash fa-4x"></div>
<div class="focus_shopTitle2">距离开始还有</div>
<div class="focus_shopTitle3">
<span class="focus_shopTitle3_1">00</span>
<span style="color:RGB(96,87,81)">:</span>
<span class="focus_shopTitle3_2">00</span>
<span style="color:RGB(96,87,81)">:</span>
<span class="focus_shopTitle3_3">00</span>
</div>
</div>
<!--小米闪购右图3-->
<div class="focus_shop_1"style="margin-right:10.25px;border-top:1px solid RGB(255,172,19);">
<img class="focus_shop_1Imag" src="/static/images/flashbuy/flashbuy1.jpg" alt="">
<p class="focus_shop_1P1">米家空气净化器Pro白色</p>
<p class="focus_shop_1P2">大空间，快循环</p>
<p class="focus_shop_1P3"><span style="color:#ff6700">1399 元</span> <del>1499元</del></p>
<div class="bg"></div>
</div>
<!--小米闪购右图3代码一样，复制即可-->
</div>
<!--小米闪购CSS样式
/*小米闪购CSS样式*/
.focus_shop p,.main p{
font-size:25px;height:75px;
line-height:90px;color:RGB(51,51,51);
}
.focus_shop_1{
width:237px;height:342px;
background:#fff;float: left;
text-align: center;line-height:50px;position: relative;
}
.focus_shop_1 .focus_shopTime{
font-size: 23px; color:RGB(239,58,59); margin:40px 0px 10px 0px;
}
.focus_shopTitle1{
color:RGB(239,58,59);
}
.focus_shopTitle2{
color:RGB(205,202,200);
}
.focus_shopTitle3 span{
color:#fff; font-size: 25px;
}
.focus_shopTitle3_1,.focus_shopTitle3_2,.focus_shopTitle3_3{
background:RGB(96,87,81);padding:8px 10px;
}
.focus_shop_1Imag{
width:180px;height:180px; margin-top:20px;
}
.focus_shop_1 .focus_shop_1P1{
font-size: 14px; height: 23px; line-height: 23px;
font-weight: bold; color:RGB(205,202,200);
}
.focus_shop_1 .focus_shop_1P2{
font-size: 12px;height: 30px;line-height: 35px;color:rgb(158, 152, 152)
}
.focus_shop_1 .focus_shop_1P3{
font-size: 13px;height: 30px;line-height: 30px;
}
.focus_shop_1 .bg{
background:rgba(0,0,0,0.02); height:100%;width:100%;
position: absolute;top:0px; left:0px;
}-->
<!-- 产品内容 -->
<div class="mains">
<div class="main">
<p>手机</p>
<div class="tab">
查看更多
<span><i class="fa fa-angle-right"></i></span>
</div>
<!--手机左部图片-->
<div class="main_left"></div>
<!--手机右部8个图片-->
<div class="main_right">
<div style="margin:0px 0px 14px 13px; ">
div class="main_r_a">新品</div>
<img src="/static/images/buy/手机新1.jpg" alt="">
<h3><a href="#">小米8 青春版 4GB+64GB </a></h3>
<p class="main_right_p1">潮流镜面渐变色，2400万自拍旗舰</p>
<p class="main_right_p2">
<span style="color:RGB(255,126,0)">1299 元</span> <del>1399 元</del>
</p>
</div>
<!--手机右部8个图片重复代码-->
</div>
<p>家电</p>
<div class="tab">
<ul>
<li>热门</li>
<li>电视影音</li>
<li>电脑</li>
<li>家居</li>
</ul>
</div>
<!--家电左边2图片-->
<div class="main_left_2">
<div class="main_left_t"style="background-image: url(/static/images/buy/家电AD1.jpg)"></div>
<div class="main_left_b"style="background-image: url(/static/images/buy/家电AD2.jpg)" ></div>
</div>
<!--家电右图片样式1-->
<div class="main_right">
<div style="margin:0px 0px 14px 13px; ">
<div class="main_r_a">新品</div>
<img src="/static/images/buy/家电1.jpg" alt="">
<h3><a href="#">小米8 青春版 4GB+64GB </a></h3>
<p class="main_right_p1">潮流镜面渐变色，2400万自拍旗舰</p>
<p class="main_right_p2">
<span style="color:RGB(255,126,0)">1299 元</span> <del>1399 元</del>
</p>
<!--弹出框-->
<div class="main_rightTc">
<p class="main_rightTc_1">速度快！服务好！效率高！师傅辛苦了！师傅辛苦了！</p>
<p class="main_rightTc_2"> 来自周星星的评价</p>
</div>
</div>
<!--家电右图片样式2 上下分行-->
<div style="margin-left:13px;background:RGB(245,245,245)">
<div class="main_right_F1" >
<p>小米净水器...</p>
<p style="color:#ff6700">1999元</p>
<img src="/static/images/buy/配件1.jpg" alt="">
</div>
<div class="main_right_F2">
<p style="font-size:20px;">浏览更多</p>
<p style="font-size:12px;">更多</p>
<span class="fa fa-arrow-circle-o-right fa-5x" style="color:#ff6700"></span>
</div>
</div>
</div>
<div class="clear"></div>
<!--广告图片-->
<div class="main_img"style="background-image:url(/static/images/longAD3.jpg)"></div>
<!--内容部分CSS样式-->
<!--
/* 内容部分*/
.mains{
background:RGB(245,245,245);
}
.main{
width:1226px;
margin:0px auto;
}
.main .tab{
float: right; margin-right: 10px; margin-top:-40px;
}
.main .tab span{
display: inline-block; width: 20px;height: 20px;background:#ccc;color:#fff;
border-radius: 10px;line-height:20px; text-align: center;
}
.main .tab:hover{
color:#ff6700;
}
.main .tab ul li{
float: left; margin-left:15px; height:25px;
}
.main .tab ul li:hover{
color:#ff6700;border-bottom:2px solid #ff6700;
}
/*手机左部1图片*/
.main_left{
width:234px;
height:614px;
background-image: url(/static/images/buy/手机AD.jpg);
float: left;
}
/*左部两2图片*/
.main_left_2{
width:234px;height:614px;float: left;
}
.main_left_t{
width:234px;height:300px;
margin-bottom:14px;background-repeat:round;
}
.main_left_b{
width:234px;
height:300px;
background-repeat:round;
}
.main_left:hover,.main_left_2 div:hover{
box-shadow: -3px 8px 10px RGB(225,225,225);
position: relative;bottom:5px;
}
/*右部产品区域*/
.main_right div{
width:235px;
height:300px;
float: left;
background:RGB(255,255,255);
position: relative;
}
.main_right div:hover{
box-shadow: -3px 8px 10px RGB(225,225,225);
position: relative;bottom:5px;
}
/*右部产品内容*/
.main_right div .main_r_a{
width:65px;height:20px;
background:RGB(131,196,78);font-size:13px;
color:#fff;line-height:20px;
text-align: center;
position: absolute; left:85px;
}
.main_right div .main_r_b{
width:65px;height:20px;
background:RGB(229,57,53);font-size:13px;
color:#fff;line-height:20px;
text-align: center;position: absolute; left:85px;
}
.main_right div img{
height: 160px;width: 160px;
position: absolute; top:20px; left:37.5px;
}
.main_right div h3{
position: absolute;top:190px;
width:235px;text-align: center;
}
.main_right div h3 a{
color:RGB(51,51,51);font-size: 14px;
font-weight: 500;
}
.main_right div .main_right_p1{
width:235px;height:30px;
font-size: 12px;line-height: 30px;
text-align: center;color:RGB(176,176,176);
position: absolute;top:210px;
}
.main_right div .main_right_p2{
width:235px;
position: absolute;top:210px;
color:RGB(176,176,176);
text-align: center;
font-size: 14px;
}
/*评价弹窗*/
.main_right div .main_rightTc{
background:#ff6700; height:80px;
position: absolute; bottom:0px;display:none;
}
.main_rightTc .main_rightTc_1,.main_rightTc .main_rightTc_2{
height:40px; line-height: 20px; font-size:13px;
padding: 0px 20px; margin-top:8px; color:#fff;
}
.main_right div:hover .main_rightTc{
display:block;-webkit-animation: upmove 1s ease; -o-animation: upmove 1s ease; animation: upmove 1s ease;
}
@keyframes upmove { from { top: 265px; opacity: 0; } to { top: 245px;opacity: 1; } }
.main_right div .main_right_F1{
width:235px;height:145px;margin-bottom:10px;
}
.main_right div .main_right_F1 img{
width:100px;height:100px; margin-left:80px;
}
.main_right div .main_right_F1 p{
font-size:14px; height: 30px;margin-left:25px;
}
.main_right div .main_right_F2{
width:235px;height:145px; position: relative;
}
.main_right_F2 p{
height:25px;margin-left:25px;
}
.main_right_F2 span{
font-size:60px; position: absolute;top:30px;left:130px;
} -->
<!--视频部分-->
<p>视频</p>
<div class="main_6">
<div class="main_6_a" style="margin-right:14px;">
<img src="/static/images/buy/视频2.jpg" alt="">
<p>一团火</p>
<p style="color:RGB(176,176,176);font-size:12px;">小米创业8年内部纪录片（手机篇）</p>
<span class="fa fa-play"></span>
</div>
<!--视频部分后面代码重复-->
</div>
<div class="clear"></div>
</div>
</div>
<!--视频部分CSS代码
/*内容视频部分*/
.main_6 .main_6_a{
width: 296px;height:285px;
background:#fff;float: left;
margin-bottom:58px;
text-align: center;
position: relative;
}
.main_6 .main_6_a img{
width:296px;height:180px;
}
.main_6 .main_6_a p{
font-size: 14px; height: 25px;
line-height: 60px;
}
.main_6 .main_6_a span{
color:#fff;border:2px solid#fff;
border-radius: 30px;width:40px;
height:26px;line-height:26px;
position: absolute;top:140px; left:20px;
}
.main_6 .main_6_a span:hover{
background:#ff6700; border:none;
}
-->
老师您好，麻烦问下咱们作业代码最多上传多少条，之前的作业上传后只能显示部分的代码，大部分代码显示上传成功，
但是每次也就成功上传300-400条代码量，还有就是这个作业的地方代码格式只能复制粘贴用空格调整么，有没有快捷
排版的方式，谢谢！
批改老师：灭绝师太批改时间：2019-02-22 09:31:00
老师总结：有字符数限制,大型案例可以提交作业完成图片及作业思路哦
