python第七十九天--第十四周作业
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>仿京东</title>
<style>
/*外框*/ .div_mingr {
height: 30px;
margin: 0 auto;
width: 980px;
}
/*左边*/ .div_left,
.div_cent_l,
.menu_cent_1 {
float: left;
}
/*中间*/ .div_cent_l {
width: 190px;
height: 100%;
background-color: #0dfsd;
} .div_cent_r {
height: 100%;
background-color: aqua;
}
/*右边*/ .div_right,
.div_cent_r,
.menu_cent_r,
.menu_cent_2 {
float: right;
}
/* 用来清楚浮动*/ .div_float {
clear: both;
}
/*<!--顶部 -->*/ .div_top_1 {
line-height: 30px;
} #div_0_1 a,
#div_0_2 a {
color: #999999;
line-height: 30px;
}
/*logo*/ .div_logo,
.div_logo_0 {
height: 170px;
}
/*标志 logo*/ .a_logo {
overflow: hidden;
display: block;
height: 170px;
/*width: 190px;*/
background-image: url(img/logo.v2.png);
} /*搜索 外框*/ .form {
margin: 0, 70px, 0, 0;
left: 320px;
top: 25px;
width: 339px;
height: 35px;
border: 1px solid;
border-color: red;
} /*搜索框*/
.input_s {
margin: 0 auto;
float: left;
line-height: 30px;
width: 280px;
border-color: red;
border-right:white ;
} .upload-bg{
margin: 0 auto;
float: left;
width: 20px;
height: 20px;
background: url(img/sprite-photo-search.png) no-repeat;
cursor: pointer;
margin-top: 10px;
}
/*<!--搜索提示-->*/
.ls a {
font: "微软雅黑";
font-size: small;
color: #666666;
} /*搜索按钮*/
.button {
margin: 0 auto;
width: 35px;
height: 35px;
background: url(img/magnifier1211.png);
} /*菜单*/
.div_meun {
background-color: red;
height: 40px;
} .menu_cent_1 {
width: 160px;
text-aling: ceter;
} /*a 标签 */
.a_red {
color: white;
line-height: 40px;
font-weight: bolder;
text-align: center;
} #go {
margin-top: 70px;
width: 188px;
height: 33px;
background-color: #fff;
text-align: center;
line-height: 33px;
overflow: hidden;
position: relative;
z-index: 1;
float: left;
border: 1px solid #e3e4e5;
} .menu_cent_2 {
margin-left: 80px;
} #meun_1 {
margin: 0 auto;
width: 160px;
text-align: center;
}
/*中间内容
.cent_meun{
width: 980px;
}*/ .left_big_meun {
float: left;
height: 310px;
width: 160px;
border: 1px solid;
border-color: #CCCCCC;
} .span_menu {
width: 160px;
height: 50px;
border: 1px solid;
border-color: #CCCCCC;
} .a_red_z {
margin: 0 auto;
font-size: 20px;
font-weight: bolder;
} .a_red_let {
font-size: 15px;
}
/*菜单左边下方*/ .cent_l_d {
clear: both;
margin-top: 30px;
width: 160px;
height: 36px;
border: 1px solid;
border-color: #CCCCCC;
background: #DDDDDD;
}
/*右边内容*/
/*右边内容上方*/ .div_cen_r_u {
/*background-color: grey;*/
width: 800px;
height: 300px;
} .div_cen_r_u_1 {
margin: auto;
} #div_r_u {
margin-top: 20px;
border: 1px solid #DDDDDD;
border-top: 2px solid red;
width: 100%;
height: 200px;
} .p_m {
padding-left: 45px;
} hr {
width: 95%;
} .td_1 {
color: #005EA7;
font-weight: bolder;
}
/*右边内容下方*/ .div_cen_r_d {
background-color: ;
width: 800px;
height: 300px;
} .cen_r_d_1 {
margin: 0 auto;
padding: 0;
border: 1px solid #D0D0D0;
height: 50px;
} .r_d_2 {
float: left;
line-height: 20px;
margin: 0 auto;
} .r_d_3 {
margin: 0 auto;
float: right;
line-height: 20px;
} .a_33 {
margin-left: 10px;
color: blue;
}
/*<!-- 右边内容下方 产品图片-->*/ .product { width: 100%;
height: 750px;
} .rp{
width: 100%;
float: left;
}
.rp1{ border: 1px solid red;
text-align: center;
float: left;
margin:5px 5px 5px 10px;
/*padding: 10px;*/
} .rp1 img{
width: 150px;
height: 150px;
}
.rp1 input[type="text"]{
width: 25px;
}
/*去除a 标签的下划线*/
ul{
list-style-type: none;/*除去ul标签前缀*/
} a {
text-decoration: none;
color: black;
}
</style> </head> <body style="margin: 0 auto">
<!--顶部 -->
<div class="div_top" id="div_0" style="background-color: #DDDDDD;">
<!--顶部 -->
<div class="div_mingr">
<div class="div_top_1 div_left" id="div_0_1">
<a>收藏本站</a>
</div>
<div class="div_top_1 div_right" id="div_0_2">
<a href="" methods="">登陆</a>
<a href="">注册</a>
<a href="">我的订单</a>
<a href="">我的收藏</a>
<a href="">VIP会员俱乐部</a>
<a href="">客户服务</a>
<a href="">关注</a>
<a href="">手机版</a>
</div>
</div>
<div class="div_float"></div>
</div> <!--logo-->
<div class="div_logo " id="div_1">
<div class="div_mingr div_logo_0">
<div class="div_mingr div_logo_0">
<div class="div_left div_logo_1">
<!-- logo 中间-->
<div class="div_cent_l">
<!-- logo图片框-->
<a href="#" class="a_logo"></a>
</div>
<div style="float: right; height: 170px; width: 300px; margin-left:200px ;">
<div style="height: 70px;"></div>
<div class="form">
<!--搜索框 -->
<form action="#">
<input type="text" name="" id="" value="水果" class="input_s" />
<span class="upload-bg"></span>
<button class="button"></button>
</form> </div>
<div class="ls">
<a href="">热门搜索:</a>
<a href="">火龙果,电脑</a>
</div>
</div> <!---->
</div>
<div class="div_right">
<div id="go">
<a href="#" name="">购物车 </a>
<a href="" style="color:red">2</a>
<a href="">件∇ </a>
</div>
<!--<input type="button" value="" />-->
</div>
</div>
<div class="div_float"></div>
</div>
<div class="div_float"></div>
</div> <!--菜单 -->
<div class="div_meun " id="div_1"> <!-- 菜单左边-->
<div class="div_mingr div_meun_0" id="">
<!-- 左边 1-->
<div class="div_meun_1 div_left">
<div class="menu_cent_1">
<a href="#" class="a_red" id="meun_1">全部商品分类</a>
</div>
<div class="menu_cent_2">
<a href="" class="a_red">首页</a>
<a href="" class="a_red">网上超市</a>
<a href="" class="a_red">水果超市</a>
<a href="" class="a_red">超级订餐</a>
<a href="" class="a_red">生活娱乐</a>
<a href="" class="a_red">研究院</a>
</div>
<div style="clear: both;"></div> </div>
<!--右边-->
<div class="div_right"> <a href="" class="a_red">研究院</a>
<a href="" class="a_red">开发组</a>
<a href="" class="a_red">论 坛</a> </div>
</div>
<div class="div_float"></div>
</div> <!--中间部分-->
<div class="cent_mingr">
<div class="mingr cent_meun div_mingr">
<div class="div_left">
<!--左边菜单-->
<div class="left_big_meun">
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">家用电器</a> <br />
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
</div>
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">水果</a> <br />
<a href="" class="a_red_let">香蕉</a>
<a href="" class="a_red_let">苹果</a>
<a href="" class="a_red_let">桃子</a>
</div>
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">家用电器</a> <br />
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a> </div>
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">家用电器</a> <br />
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
</div>
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">家用电器</a> <br />
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
<a href="" class="a_red_let">电冰箱</a>
</div>
<div class="span_menu">
<!--左边菜单 分类-->
<a href="#" class="a_red_z">水果</a> <br />
<a href="" class="a_red_let">香蕉</a>
<a href="" class="a_red_let">苹果</a>
<a href="" class="a_red_let">桃子</a>
</div>
</div>
<div style="width: 160px ; height: 15px; clear: both"> </div>
<div class="cent_l_d">
<!-- 左边下方-->
<p>热销排行榜</p>
</div>
<div style="border: 1px solid ;border-color:#ECECEC ;">
<a href="">coneting</a>
</div> </div> <div class="div_right">
<!--右边内容-->
<div class="div_cen_r_u">
<!-- 右边内容上方-->
<div style="height: 30px;"></div>
<div class="div_cen_r_u_1">
<a href="#">电脑</a> >>
<a href="">品牌</a>>>
<a href="#">联想</a>>>
</div>
<div id="div_r_u">
<p>您已选择： 联想 </p>
<hr/>
<p class="p_m">
<tr>
<a href="">
<td class="td_1">材质：</td>
</a>
<a href="">
<td> 工艺金属</td>
</a>
<a href="">
<td> 工程塑料</td>
</a>
<a href="">
<td> 红木</td>
</a>
</tr>
</p>
<hr />
<p class="p_m">
<tr>
<a href="">
<td class="td_1">风格：</td>
</a>
<a href="">
<td> 小清新</td>
</a>
<a href="">
<td> 温情脉脉</td>
</a>
<a href="">
<td> 创意</td>
</a>
</tr>
</p>
<hr />
<p class="p_m">
<tr>
<a href="">
<td class="td_1">材质：</td>
</a>
<a href="">
<td> 工艺金属</td>
</a>
<a href="">
<td> 工程塑料</td>
</a>
<a href="">
<td> 红木</td>
</a>
</tr>
</p> </div>
<div>
<div style="width:70px;height: 20px; border: 1px solid #DDDDDD; margin: 0 auto; font-size:12px ; text-align: center;">
<a href="">更多选项</a>
</div>
</div> </div> <!-- 右边内容下方-->
<div class="div_cen_r_d">
<!-- 右边内容下方-->
<div class="cen_r_d_1">
<div class="r_d_2">
<p><span id="" style="margin-right: 25px;">排序:</span>
<a href="" class="a_33">价格</a>
<a href="" class="a_33">销量</a>
<a href="" class="a_33">最新</a>
</p>
</div>
<div class="r_d_3">
<p>
<a href="" style="color:red">共XX件商品 1</a>
<a href="">/1685</a> <input type="button" name="" id="" value="<" /><input type="button" name="" id="" value=">" /></p>
</div>
</div>
<!--<div class="div_float"></div>-->
<!-- 右边内容下方 产品图片-->
<div class="product">
<!--<div class="lp">-->
<ul class="rp"><!--小视窗--> <li class="rp1"><a class="a1" href="#"><img src="img/11.jpg"><p>¥5999.00<br>Apple MacBook Air <br>13.3英寸笔记本电脑</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
<li class="rp1"><a class="a1" href="#"><img src="img/12.jpg"><p>¥6480.00<br>拯救者R720<br>联想电脑旗舰店</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" /> </li>
<li class="rp1"><a class="a1" href="#"><img src="img/13.jpg"><p>¥5999.00<br>惠普(HP)暗影精灵II代Pro 暗影红<br>15.6英寸游戏笔记本</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
<li class="rp1"><a class="a1" href="#"><img src="img/14.jpg"><p>¥3599.00<br>小米(MI) Air 12.5英寸<br>金属超轻薄笔记本电脑</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li> </ul>
<ul class="rp">
<li class="rp1"><a class="a1" href="#"><img src="img/15.jpg"><p>¥4199.00<br>宏碁（acer）小e E5<br>15.6英寸便携笔记本电脑</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
<li class="rp1"><a class="a1" href="#"><img src="img/13.jpg"><p>¥5999.00<br>拯救者R720<br>联想电脑旗舰店</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
<li class="rp1"><a class="a1" href="#"><img src="img/12.jpg"><p>¥5999.00<br>拯救者R720<br>联想电脑旗舰店</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
<li class="rp1"><a class="a1" href="#"><img src="img/11.jpg"><p>¥5999.00<br>拯救者R720<br>联想电脑旗舰店</p></a>
<input type="button" name="" id="" value="-" />
<input type="text" value="1"/>
<input type="button" name="" id="" value="+" />
</li>
</ul> <!--</div>--> </div>
</div> </div> </div>
<div class="div_float"></div> </div>
</body> </html>
python第七十九天--第十四周作业的更多相关文章
- python第一百六十九天,第十九周作业
FIRSTCRM 学员管理开发需求: 1.分讲师\学员\课程顾问角色, 2.学员可以属于多个班级,学员成绩按课程分别统计 3.每个班级至少包含一个或多个讲师 4.一个学员要有状态转化的过程 ,比如未报 ...
- 孤荷凌寒自学python第七十九天开始写Python的第一个爬虫9并使用pydocx模块将结果写入word文档
孤荷凌寒自学python第七十九天开始写Python的第一个爬虫9 (完整学习过程屏幕记录视频地址在文末) 今天在上一天的基础上继续完成对我的第一个代码程序的书写. 到今天终于完成了对docx模块针对 ...
- 孤荷凌寒自学python第七十六天开始写Python的第一个爬虫6
孤荷凌寒自学python第七十六天开始写Python的第一个爬虫6 (完整学习过程屏幕记录视频地址在文末) 今天在上一天的基础上继续完成对我的第一个代码程序的书写. 不过由于对python-docx模 ...
- 孤荷凌寒自学python第七十五天开始写Python的第一个爬虫5
孤荷凌寒自学python第七十五天开始写Python的第一个爬虫5 (完整学习过程屏幕记录视频地址在文末) 今天在上一天的基础上继续完成对我的第一个代码程序的书写. 直接上代码.详细过程见文末屏幕录像 ...
- 孤荷凌寒自学python第七十四天开始写Python的第一个爬虫4
孤荷凌寒自学python第七十四天开始写Python的第一个爬虫4 (完整学习过程屏幕记录视频地址在文末) 今天在上一天的基础上继续完成对我的第一个代码程序的书写. 直接上代码.详细过程见文末屏幕录像 ...
- 孤荷凌寒自学python第七十天学习并实践beautifulsoup对象用法3
孤荷凌寒自学python第七十天学习并实践beautifulsoup对象用法3 (完整学习过程屏幕记录视频地址在文末) 今天继续学习beautifulsoup对象的属性与方法等内容. 一.今天进一步了 ...
- 孤荷凌寒自学python第六十九天学习并实践beautifulsoup对象用法2
孤荷凌寒自学python第六十九天学习并实践beautifulsoup对象用法2 (完整学习过程屏幕记录视频地址在文末) 今天继续学习beautifulsoup对象的属性与方法等内容. 一.今天进一步 ...
- 孤荷凌寒自学python第五十九天尝试使用python来读访问远端MongoDb数据服务
孤荷凌寒自学python第五十九天尝试使用python来读访问远端MongoDb数据服务 (完整学习过程屏幕记录视频地址在文末) 今天是学习mongoDB数据库的第五天.今天的感觉是,mongoDB数 ...
- 孤荷凌寒自学python第四十九天继续研究跨不同类型数据库的通用数据表操作函数
孤荷凌寒自学python第四十九天继续研究跨不同类型数据库的通用数据表操作函数 (完整学习过程屏幕记录视频地址在文末,手写笔记在文末) 今天继续建构自感觉用起来顺手些的自定义模块和类的代码. 不同类型 ...
随机推荐
- [视频]K8飞刀 shellcode loader演示教程
[视频]K8飞刀 shellcode loader演示教程 https://pan.baidu.com/s/1eQ77lPw
- QC内部分享ppt
Quality Center是一个基于Web的测试管理工具,可以组织和管理应用程序测试流程的所有阶段,包括制定测试需求.计划测试.执行测试和跟踪缺陷.此外,通过Quality Center还可以创建报 ...
- centos7 部署YApi
=============================================== 2018/6/5_第2次修改 ccb_warlock 更新说 ...
- python中selenium操作下拉滚动条方法汇总
UI自动化中经常会遇到元素识别不到,找不到的问题,原因有很多,比如不在iframe里,xpath或id写错了等等:但有一种是在当前显示的页面元素不可见,拖动下拉条后元素就出来了. 比如下面这样一个网页 ...
- Retrofit2+Rxjava2的用法
近几年,Retrofit犹如燎原之火搬席卷了整个Android界.要是不懂Retrofit,简直不好意思出门... 由于近几个项目都没用到Retrofit,无奈只能业余时间自己撸一下,写的不好的地方, ...
- win32之进程概念
win32之进程 一丶简介 学习WindowsAPI. 之前.我们必须理解什么是进程. 在windows环境下.进程就是一个运行起来的exe程序 进程提供了数据以及资源. 但是怎么使用不管.而是由线程 ...
- 理解 React Hooks
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由志航发表于云+社区专栏 TL;DR 一句话总结 React Hooks 就是在 react 函数组件中,也可以使用类组件(classe ...
- PHP正则表达式修饰符的种类及介绍
◆i :如果在修饰符中加上"i",则正则将会取消大小写敏感性,即"a"和"A" 是一样的.◆m:默认的正则开始"^"和结 ...
- JavaWeb学习 (二十八)————文件上传和下载
在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用 ...
- #18 turtle模块
前言 这一节继续记录模块,本节将记录Python中一个非常重要的画图模块——turtle,Here we go! 一.turtle模块 turtle(海龟)模块是Python中强大的内置画图模块,可以 ...