网页小测试代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#kuangjia {
height: auto;
width: 100%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#welcome {
height: 17px;
width: 100%;
background-color: #f5f5f5;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#name {
height: 80px;
width: 100%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
.jiaqian {
font-size: 24px;
color: #f0573e;
}
#daohang {
height: 40px;
width: 100%;
font-size: 12px;
background-color: #ff6932;
}
#mianfei {
height: 280px;
width: 70%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
padding-top: 10px;
}
#yaoqing {
height: 80px;
width: 70%;
margin-top: 10px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #ffcab8;
text-align: center;
line-height: 80px;
vertical-align: middle;
}
#banner {
background-color: #ffcab8;
height: 100px;
width: 70%;
margin-top: 20px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
line-height: 100px;
text-align: center;
vertical-align: middle;
}
#jinping {
height: 650px;
width: 70%;
margin-top: 10px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#yongjin {
height: 300px;
width: 70%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#shiyong {
height: 360px;
width: 70%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#shouyi {
height: 280px;
width: 70%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#weibu {
height: 90px;
width: 55%;
margin-top: 10px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#huanying {
height: 100%;
width: 50%;
float: left;
clear: none;
}
#denglu {
height: 100%;
width: 50%;
float: right;
}
#mingzi {
height: 80px;
width: 50%;
float: left;
}
#mingzi #wangming {
height: 74%;
width: 30%;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
background-color: #ffd0c0;
font-size: 18px;
text-align: center;
line-height: 55px;
list-style-type: none;
vertical-align: middle;
}
#sousuo {
height: 80%;
width: 30%;
float: left;
padding-top: 30px;
padding-left: 20px;
}
#daohang ul{
line-height: 40px;
color: #FFFFFF;
text-align: center;
display: block;
float: left;
height: 40px;
width: 60%;
list-style-type: none;
background-color: #ff6932;
padding-left: 180px;
margin: 0;padding: 0;list-style: none;
}
#shangjia {
height: 50px;
width: 100px;
text-align: center;
}
#kuangjia #daohang ul li {
line-height: 40px;
color: #FFFFFF;
text-align: center;
display: block;
float: left;
height: 40px;
width: 100px;
list-style-type: none;
background-color: #ff6932;
}
body,td,th {
font-size: 12px;
font-family: "微软雅黑";
}
#daohang a:link {
text-decoration: none;
color: #FFF;
}
#denglu a:link {
text-decoration: none;
color: #5F5F5F;
}
#apDiv5 a:link {
text-decoration: none;
color: 969696;
color:#fff;
}
a:visited {
text-decoration: none;
}
#daohang a:hover {
text-decoration: none;
background-color: #ff5a00;
padding-top: 10px;
padding-left: 25px;
padding-right: 25px;
padding-bottom: 11px;
color:#FFF;
}
#apDiv5 a:hover {
text-decoration: none;
background-color: #ff5a00;
padding-top: 10px;
padding-left: 25px;
padding-right: 25px;
padding-bottom: 11px;
color:#FFF;
}
a:active {
text-decoration: none;
}
#tupian {
float: left;
height: 100%;
width: 53%;
margin-left: 10px;
border: 1px solid #bfbfbf;
text-align: center;
}
#chanpin {
float: left;
height: 100%;
width: 15%;
border: 1px solid #fe8e64;
}
#gonggao {
float: left;
height: 100%;
width: 29%;
margin-left: 10px;
}
#sy {
height: 48%;
width: 100%;
border: 1px solid #bebebe;
margin-top: 10px;
text-align: center;
line-height: 130px;
vertical-align: middle;
}
#chaoliu {
height: 98%;
width: 95%;
margin-right: auto;
margin-left: auto;
border: 1px solid #ffd7c7;
margin-top: 2px;
margin-bottom: 2px;
text-align: center;
line-height: 20px;
vertical-align: middle;
}
#apDiv1 {
position: absolute;
left: 921px;
top: 518px;
width: 73px;
height: 19px;
z-index: 1;
}
#pidai {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
}
#bao {
float: left;
width: 23%;
border: 1px solid #e0e0e0;
height: 270px;
margin-left: 20px;
margin-top: 20px;
}
#pixie {
float: left;
height: 270px;
width: 23%;
margin-left: 20px;
border: 1px solid #e0e0e0;
}
#shubao {
float: left;
height: 270px;
width: 23%;
margin-left: 20px;
border: 1px solid #e0e0e0;
}
#chuang {
float: left;
height: 270px;
width: 23%;
margin-left: 20px;
border: 1px solid #e0e0e0;
}
#kuzi {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-left: 20px;
margin-top: 20px;
}
#neiyi {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-left: 20px;
margin-top: 20px;
}
#lianyixun {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-top: 20px;
}
#pd {
height: 65%;
width: 85%;
border: 1px solid #e5e5e5;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#px {
height: 65%;
width: 85%;
border: 1px solid #e5e5e5;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#sb {
height: 65%;
width: 85%;
border: 1px solid #e5e5e5;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#c {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#lyq {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#ny {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#kz {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#b {
height: 65%;
width: 85%;
border: 1px solid #e5e5e5;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#pdm {
height: 20%;
width: 85%;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
}
#pdm input {
background-color: #ff5b5a;
}
#apDiv2 {
position: absolute;
left: 922px;
top: 1168px;
width: 72px;
height: 21px;
z-index: 2;
}
.yj {
float: left;
height: 100px;
width: 31%;
border: 1px solid #fecfcb;
margin-top: 10px;
margin-right: 15px;
}
.renwu {
text-align: center;
float: left;
height: 100%;
width: 60%;
}
.chakan {
text-align: center;
float: right;
height: 100px;
width: 39%;
border: 1px solid #fee4c1;
background-color: #fff3ea;
line-height: 100px;
vertical-align: middle;
margin: 0px;
padding: 0px;
}
#apDiv3 {
position: absolute;
left: 922px;
top: 1468px;
width: 74px;
height: 22px;
z-index: 3;
}
#changjia {
float: left;
height: 270px;
width: 23%;
margin-left: 20px;
margin-top: 20px;
border: 1px solid #e0e0e0;
}
#nuojiya {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-left: 20px;
margin-top: 20px;
}
#chunzhuang {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-left: 20px;
margin-top: 20px;
}
#baoyou {
float: left;
height: 270px;
width: 23%;
border: 1px solid #e0e0e0;
margin-top: 20px;
}
#by {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#cz {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#njy {
height: 65%;
width: 85%;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#cj {
height: 65%;
width: 85%;
border: 1px solid #e5e5e5;
text-align: center;
margin-top: 3px;
margin-right: auto;
margin-left: auto;
}
#shouyibang {
height: 100%;
width: 26%;
float: left;
margin-left: 70px;
border: 2px solid #e9e9e9;
}
#chufa {
height: 100%;
width: 26%;
float: left;
margin-left: 20px;
border: 2px solid #ececec;
}
#jinggao {
height: 100%;
width: 26%;
float: left;
margin-left: 20px;
border: 2px solid #ececec;
}
#bangzhu {
float: left;
height: 100%;
width: 23%;
margin-left: 40px;
}
#changjian {
float: left;
height: 100%;
width: 23%;
margin-left: 20;
}
#guanzhu {
float: left;
height: 100%;
width: 23%;
margin-left: 20;
}
#lianxi {
float: left;
height: 100%;
width: 23%;
margin-left: 20;
}
#apDiv4 {
position: absolute;
left: 940px;
top: 98px;
width: 99px;
height: 38px;
z-index: 4;
}
#apDiv5 {
position: absolute;
left: 907px;
top: 98px;
width: 100px;
height: 40px;
z-index: 4;
line-height: 40px;
text-align: center;
vertical-align: middle;
}
body {
margin-top: 0px;
padding-top: 0px;
color:#7E807E;
}
.new {
color: #e7394d;
}
.shuipingxian {
color: #e5e5e5;
}
.zhekou {
color: #fc764c;
}
.old {
color: #b8c1bd;
}
.danshu {
color: #867973;
}
.shengyu {
color: #d0d0d0;
}
.anniu {
background-color: #fb952a;
}
.chaozhi {
font-size: 18px;
color: #e61327;
float: left;
height: 100%;
width: 55%;
}
.shou {
float: left;
height: 100%;
width: 45%;
text-align: center;
}
.jia {
font-size: 12px;
color: #68748b;
}
.hong {
color: #e62657;
}
.dan {
font-size: 12px;
color: #e94b81;
}
.top {
color: #df2191;
}
.bang {
color: #fe4332;
}
.jiangsu {
color: #eb7b9d;
}
.xiahuaxian {
text-decoration: underline;
}
.abc {
height: 100%;
width: 100px;
float: left;
}
#biaodan {
height: 48%;
width: 100%;
border: 1px solid #bebebe;
text-align:center;
}
body {
margin: 0px;
padding: 0px;
}
#shang{
height: 30;
text-align: center;
line-height: 30px;
vertical-align: middle;
}
#xia {
height: 500px;
}
#xia a:link,#xia a:visited,#xia a:hover{
text-decoration:none;
}
#zhengzhi,#wenhua{
display:none;
}
#biaodan #sp-junshi{
width: 33%;
height: 29px;
border-right: 1px solid #bebebe;
float: left;
border-bottom: none;
}
#biaodan #sp-zhengzhi{
width: 33%;
height: 29px;
border-right: 1px solid #bebebe;
border-bottom: 1px solid #bebebe;
float: left;
}
#biaodan #sp-wenhua{
width: 33.4%;
height: 29px;
border-bottom: 1px solid #bebebe;
float: left;
}
#junshi ul ,#zhengzhi ul,#wenhua ul{
padding:none;
margin:none;
}
</style>
<script>
function xianshijunshi(){
//军事显示
document.getElementById("junshi").style.display = "block";
//政治隐藏
document.getElementById("zhengzhi").style.display = "none";
//文化隐藏
document.getElementById("wenhua").style.display = "none";
document.getElementById("sp-junshi").style.borderBottom = "none"
document.getElementById("sp-zhengzhi").style.borderBottom = "1px solid #bebebe";
document.getElementById("sp-wenhua").style.borderBottom = "1px solid #bebebe";
}
function xianshizhengzhi(){
//军事隐藏
document.getElementById("junshi").style.display = "none";
//政治显示
document.getElementById("zhengzhi").style.display = "block";
//文化隐藏
document.getElementById("wenhua").style.display = "none";
document.getElementById("sp-junshi").style.borderBottom = "1px solid #bebebe";
document.getElementById("sp-zhengzhi").style.borderBottom = "none";
document.getElementById("sp-wenhua").style.borderBottom = "1px solid #bebebe";
}
function xianshiwenhua(){
//军事隐藏
document.getElementById("junshi").style.display = "none";
//政治隐藏
document.getElementById("zhengzhi").style.display = "none";
//文化显示
document.getElementById("wenhua").style.display = "block";
document.getElementById("sp-junshi").style.borderBottom = "1px solid #bebebe";
document.getElementById("sp-zhengzhi").style.borderBottom = "1px solid #bebebe";
document.getElementById("sp-wenhua").style.borderBottom = "none";
}
</script>
</head>
<body>
<div id="apDiv1">查看更多</div>
<div id="apDiv2">查看更多</div>
<div id="apDiv3">查看更多</div>
<div id="apDiv5"><a href="#">
商家报名</a></div>
<div id="kuangjia">
<div id="welcome" >
<div id="huanying" style="text-align : center; font-size: 12px;">欢迎来到驻马店</div>
<div id="denglu" style="text-align : center; font-size: 12px;"><a href="#">登陆</a> | <a href="#">注册</a> <a href="#">帮助中心</a></div>
<div style="clear:both;></div>
</div>
<div id="name">
<div id="mingzi">
<div id="wangming">网站名字</div>
</div>
<div id="sousuo">
<div id="sou"><img src="images/sousuo.png" width="258" height="39" /></div>
</div>
<div style="clear:both;"></div>
</div>
<div id="daohang">
<ul>
<li class=“abc”><a href="#">首 页</a></li>
<li class=“abc”><a href="#">精选商品</a></li>
<li class=“abc”><a href="#">佣金任务</a></li>
<li class=“abc”><a href="#">免费使用</a></li>
<li class=“abc”><a href="#">使用中心</a></li>
<li class=“abc”><a href="#">旺旺查询</a></li>
</ul>
</div>
<div id="mianfei">
<div id="chanpin">
<div id="chaoliu"><img src="images/yifu.png" width="18" height="19" />潮流女装<br />
<img src="images/nanzhuang.png" width="20" height="15" />精品男装<br />
<img src="images/xiezi.png" width="23" height="16" />鞋子箱包<br />
<img src="images/dapei.png" width="20" height="15" />时尚饰品<br />
<img src="images/bangong.png" width="20" height="22" />办公用品<br />
<img src="images/shuma.png" width="20" height="19" />数码家电<br />
<img src="images/jiaju.png" width="23" height="20" />家居日用<br />
<img src="images/meirong.png" width="19" height="19" />美容美肤<br />
<img src="images/ertong.png" width="21" height="19" />儿童服装<br />
<img src="images/zhonghe.png" width="20" height="20" />综合使用<br />
<img src="images/xuni.png" width="21" height="22" />虚拟产品<br />
</div>
</div>
<div id="tupian"><img src="images/tupian.png" width="424" height="227" /></div>
<div id="gonggao">
<div id="biaodan">
<div id="shang" >
<div id="sp-junshi" class="s1" onMouseover="xianshijunshi()">军事</div>
<div id="sp-zhengzhi" class="s2" onMouseover="xianshizhengzhi()">政治</div>
<div id="sp-wenhua" class="s3" onMouseover="xianshiwenhua()">文化</div>
<div style="clear:both;"></div>
</div>
<div id="xia">
<div id="junshi" class ="info">
<ul>
<li><a href="#">军事军事军事军事军事军事军事</a></li>
<li><a href="#">军事军事军事军事军事军事军事</a></li>
<li><a href="#">军事军事军事军事军事军事军事</a></li>
<li><a href="#">军事军事军事军事军事军事军事</a></li>
<li><a href="#">军事军事军事军事军事军事军事</a></li>
</ul>
</div>
<div id="zhengzhi" class ="info">
<ul>
<li><a href="#">政治政治政治政治政治政治政治</a></li>
<li><a href="#">政治政治政治政治政治政治政治</a></li>
<li><a href="#">政治政治政治政治政治政治政治</a></li>
<li><a href="#">政治政治政治政治政治政治政治</a></li>
<li><a href="#">政治政治政治政治政治政治政治</a></li
></ul>
</div>
<div id="wenhua" class ="info">
<ul>
<li><a href="#">文化文化文化文化文化文化文化</a></li>
<li><a href="#">文化文化文化文化文化文化文化</a></li>
<li><a href="#">文化文化文化文化文化文化文化</a></li>
<li><a href="#">文化文化文化文化文化文化文化</a></li>
<li><a href="#">文化文化文化文化文化文化文化</a></li>
</ul>
</div>
</div>
</div>
<div id="sy">试用流程(一个图片)
</div>
</div>
<div style="clear:both;"></div>
</div>
<div id="yaoqing">邀请送积分banner</div>
<div id="jinping">精选商品<br /><hr class="shuipingxian" />
<div id="pidai">真皮休闲腰带平滑扣头层纯牛皮<br />
<div id="pd"><img src="images/pidai.png" width="156" height="157" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="pixie">头层真皮豆豆鞋男士休闲鞋男鞋<br />
<div id="px"><img src="images/pixie.png" width="156" height="157" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="shubao">韩版中学双肩包撞色拼接学院风男<br />
<div id="sb"><img src="images/shubao.png" width="158" height="156" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="chuang">新款床上用品素色纯棉四件套<br />
<div id="c"><img src="images/chuang.png" width="155" height="157" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="lianyixun">气质女装长连衣裙包臀修身打低长<br />
<div id="lyq"><img src="images/lianyiqun.png" width="157" height="157" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="neiyi">聚拢文胸套装性感深V调整型内衣<br />
<div id="ny"><img src="images/neiyi.png" width="157" height="155" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /><input name="goumai" type="button" value="购买" /></div>
</div>
<div id="kuzi">假两件打底裤子包臀裙裤拼木耳边<br />
<div id="kz"><img src="images/kuzi.png" width="156" height="158" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<div id="bao">新款时尚潮女士链条单肩包<br />
<div id="b"><img src="images/bao.png" width="156" height="156" /></div><br />
<div id="pdm">
<span class="new">¥59.00</span>
<span class="old">¥288.00</span>
<span class="zhekou">2.0折</span>
<div style="clear:both;"></div>
<img src="images/shijian.png" width="97" height="33" /> <input name="goumai" type="button" value="购买" /></div>
</div>
<br/>
<div style="clear:both;"></div>
</div>
<div id="yongjin">佣金任务<br /><hr class="shuipingxian" />
<div class="yj">
<div class="renwu">
<span class="biaoti">[1钻起]男士短袖T恤任务</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /><br />
<img src="images/naozhong.png" width="46" height="20" /></div>
<div style="clear:both;"></div>
</div>
<div class="yj">
<div class="renwu">
<span class="biaoti">购物赚钱测试活动</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />
下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /></div>
<div style="clear:both;"></div>
</div>
<div class="yj">
<div class="renwu">
<span class="biaoti">学生女装短袖</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />
下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /><br />
<img src="images/jiaoliu.png" width="23" height="22" /></div>
<div style="clear:both;"></div>
</div>
<div class="yj">
<div class="renwu">
<span class="biaoti">电脑网线双绞线</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /><br />
<img src="images/jiaoliu.png" width="23" height="22" /></div>
<div style="clear:both;"></div>
</div>
<div class="yj">
<div class="renwu">
<span class="biaoti">德国韩国转换插座</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />
下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /></div>
<div style="clear:both;"></div>
</div>
<div class="yj">
<div class="renwu">
<span class="biaoti">[2心起]认真诚信亲来</span><br />
<span class="jiaqian">¥6元佣金</span><br />
<span class="danshu"><br />
下单49元,返还55元</span><br />
<span class="shengyu">剩余份数:12/12份</span>
<div style="clear:both;"></div>
</div>
<div class="chakan">
<input type="button" class="anniu" value="查看佣金活动" /><br />
<img src="images/nao.png" width="33" height="21" /></div>
<div style="clear:both;"></div>
</div>
<div style="clear:both;"></div>
</div>
<div id="shiyong">试用任务<br />
<hr class="shuipingxian" /><br />
<div id="baoyou">包邮LG顶级RcEn润膏YUGO洗发<br />
<div id="by"><img src="images/xifa.png" width="169" height="168" /></div><br />
<div id="pdm">
<div class="chaozhi" id="chaozhi">
<span class="cz">超值试用</span><br />
<span class="jia">下单价:</span><span class="dan">¥69.00</span><br />
<span class="jia">超值价:</span><span class="dan">¥10.00</span></div>
<div class="shou" ><img src="images/shou.png" width="65" height="15" /><br />
<input name="goumai" type="button" value="抢购" /></div>
</div>
</div>
<div id="chunzhuang">2015春装新款韩版修身大码女装七<br />
<div id="cz"><img src="images/nvzhuang.png" width="168" height="168" /></div><br />
<div id="pdm">
<div class="chaozhi" id="chaozhi">
<span class="cz">超值试用</span><br />
<span class="jia">下单价:</span><span class="dan">¥69.00</span><br />
<span class="jia">超值价:</span><span class="dan">¥10.00</span></div>
<div class="shou" id="shou"><img src="images/shou.png" width="65" height="15" />
<input name="goumai" type="button" value="抢购" /></div>
</div>
</div>
<div id="nuojiya">Nokia/诺基亚107 1070双卡双待<br />
<div id="njy"><img src="images/nuojiya.png" width="167" height="168" /></div><br />
<div id="pdm">
<div class="chaozhi" id="chaozhi">
<span class="cz">超值试用</span><br />
<span class="jia">下单价:</span><span class="dan">¥69.00</span><br />
<span class="jia">超值价:</span><span class="dan">¥10.00</span></div>
<div class="shou" id="shou"><img src="images/shou.png" width="65" height="15" />
<input name="goumai" type="button" value="抢购" /></div>
</div>
</div>
<div id="changjia">厂家直销促销款家里厨房用天然气<br />
<div id="cj"><img src="images/tianran.png" width="168" height="168" /></div><br />
<div id="pdm">
<div class="chaozhi" id="chaozhi">
<span class="cz">超值试用</span><br />
<span class="jia">下单价:</span><span class="dan">¥69.00</span><br />
<span class="jia">超值价:</span><span class="dan">¥10.00</span></div>
<div class="shou" id="shou"><img src="images/shou.png" width="65" height="15" />
<input name="goumai" type="button" value="抢购" /></div>
</div>
</div>
<div style="clear:both;"></div>
</div>
<div id="shouyi">
<div id="shouyibang"><span class="bang">收益榜</span><br />
<hr class="shuipingxian" />
<br />
<table width="200">
<tr>
<td width="15%" class="top">Top1</td>
<td width="30%">vioal**</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top2</td>
<td width="30%">jgkib%</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top3</td>
<td width="30%">vioal**</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top4</td>
<td width="30%">jgkib%</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top5</td>
<td width="30%">vioal**</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top6</td>
<td width="30%">jgkib%</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top7</td>
<td width="30%">vioal**</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top8</td>
<td width="30%">jgkib%</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top9</td>
<td width="30%">vioal**</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
<tr>
<td width="15%" class="top">Top10</td>
<td width="30%">jgkib%</td>
<td width="25%">总收益</td>
<td class="top">¥1997.99</td>
</tr>
</table>
</div>
<div id="chufa"><span class="bang">处罚信息列表</span><br />
<hr class="shuipingxian" />
<br />
<table width="209" border="0">
<tr>
<td width="220"><span class="jiangsu">江苏宁宁</span><span class="xiahuaxian">被不返佣金并扣回淘客爹2014运动休闲天鹅绒套(手机下单)</span><br /> <br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span><span class="xiahuaxian">被不返佣金并扣回淘客爹2014运动休闲天鹅绒套(手机下单)<br />
</span><br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span><span class="xiahuaxian">被不返佣金并扣回淘客爹2014运动休闲天鹅绒套(手机下单)<br />
</span><br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span><span class="xiahuaxian">被不返佣金并扣回淘客爹2014运动休闲天鹅绒套(手机下单)<br />
</span><br /></td>
</tr>
</table>
</div>
<div id="jinggao"><span class="bang">警告信息列表</span><br />
<hr class="shuipingxian" />
<br />
<table width="200">
<tr>
<td><span class="jiangsu">江苏宁宁</span> 被警告一次<span class="xiahuaxian">(未评价)</span><br />
<br />
<br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span> 被警告一次<span class="xiahuaxian">(未评价)</span><br />
<br />
<br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span> 被警告一次<span class="xiahuaxian">(未评价)</span><br />
<br />
<br /></td>
</tr>
<tr>
<td><span class="jiangsu">江苏宁宁</span> 被警告一次<span class="xiahuaxian">(现在都是薄的,你评价很厚,让我怎么卖?)</span><br />
<br /></td>
</tr>
</table>
</div>
<div style="clear:both;"></div>
</div>
<div id="banner">banner</div>
<div id="weibu">
<div id="bangzhu">
帮助中心<br />
关于我们<br />
试用模式介绍<br />
免费是如何实现的<br />
手机认证
</div>
<div id="changjian">
常见问题<br />
访客的宗旨<br />
试客行为规则<br />
试客申诉维权
</div>
<div id="guanzhu">关注我们<br />
<img src="images/qq.png" width="19" height="20" />加入qq群<br />
<img src="images/weibo.png" width="23" height="20" />微博关注</div>
<div id="lianxi">联系我们<br />
</div>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>
实现视图:
前端js实现淘宝部分界面
最新推荐文章于 2023-03-17 23:07:20 发布