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第四十九天继续研究跨不同类型数据库的通用数据表操作函数 (完整学习过程屏幕记录视频地址在文末,手写笔记在文末) 今天继续建构自感觉用起来顺手些的自定义模块和类的代码. 不同类型 ...
随机推荐
- 【xsy2303】呀 dp
题目大意:你需要构造一个长度为$n$的排列$A$,使得里面包含有子序列$B$(子序列$B$为一个给定的$1$到$m$的排列),且对于每个$i$,有$A[A[i]]=i$,问有多少种方案方案. 数据范围 ...
- Python基础教程(第3版) 笔记（一）
1.1 数和表达式: 除法运算的结果为小数,即浮点数 >>>1/2 0.5 除法运算为整数,使用双斜杠 >>>1//2 0 >>>5.0//2.4 ...
- Nginx 的两种认证方式
简介: 今天来研究一下 Nginx 的两种认证方式. 1.auth_basic 本机认证 2.ngx_http_auth_request_module 第三方认证 一.安装 Nginx shell & ...
- 音频标签化2：youtube-8m项目的训练、评估与测试
之前小程介绍了使用机器学习的办法来解决"音频标签化"的问题,并且提到了训练样本audioset跟youtube-8m的dataset,而训练模型上也提到了youtube-8m的模型 ...
- CentOS7用阿里云Docker Yum源在线安装Docker
一.参考文档 官方Docker安装文档:https://docs.docker.com/install/linux/docker-ce/centos 阿里云Docker安装文档:https://yq. ...
- System.Action的使用（lambda 表达式）
对于Action的使用方法使用如下: namespace ConsoleApp1 { class Program { static void Main(string[] args) { string ...
- freemarker中使用<@spring.*>标签实现国际化
freemarker实现国际化使用自定义指令<@spring>实现,通过@符号可以看出是自定义的指令,在哪里定义的呢? 路径如下:org/springframework/spring-we ...
- MongoDB框架Jongo的使用介绍
1.Jongo可以用来做什么? Jongo框架的目的是使在MongoDB中可以直接使用的查询Shell可以直接在Java中使用.在官网首页有一个非常简洁的例子: SHELL:这种查询方式是Mo ...
- SpringBoot入门之基于注解的Mybatis
今天学习下SpringBoot集成mybatis,集成mybatis一般有两种方式,一个是基于注解的一个是基于xml配置的.今天先了解下基于注解的mybatis集成. 一.引入依赖项 因为是mybat ...
- 基于tcp协议下粘包现象和解决方案,socketserver
一.缓冲区 每个 socket 被创建后,都会分配两个缓冲区,输入缓冲区和输出缓冲区.write()/send() 并不立即向网络中传输数据,而是先将数据写入缓冲区中,再由TCP协议将数据从缓冲区发送 ...